Salesforce LWC作为快速操作刷新相关列表

119 阅读1分钟

如果自定义的快速操作想要刷新详情页的相关列表,直接调用 this.dispatchEvent(new RefreshEvent()); 这个标准的方法其实是不生效的。当它在详情页时才会生效,可以简单理解为快速操作是一个新的页面,刷新时,获取不到详情页。

解决方法:创建一个公共的空白LWC,放在详情页,订阅一个LMS,然后执行刷新。

1.创建LMS:在IDEA中新建blankChannel.messageChannel-meta.xml,虽然部署成功了,但是在LWC中引入发现找不到资源,最后还是在VSCode中新建,参考这篇文章

<?xml version="1.0" encoding="UTF-8" ?> 
<LightningMessageChannel xmlns="http://soap.sforce.com/2006/04/metadata">
    <masterLabel>blankLwcChannel</masterLabel> 
    <isExposed>true</isExposed> 
    <description>这是一个消息通道。</description> 
    
    <lightningMessageFields> 
        <fieldName>recordId</fieldName> 
        <description>传输的详情页ID</description> 
    </lightningMessageFields> 
</LightningMessageChannel>

2.创建空白的LWC:blankRecordPage

<template>
    <input type="hidden" value={recordId} /> 
</template>
import {LightningElement,api,wire} from 'lwc';  
import { subscribe, MessageContext, unsubscribe } from 'lightning/messageService';  
import Blank_Channel from '@salesforce/messageChannel/blankChannel__c';  
import { ShowToastEvent } from 'lightning/platformShowToastEvent';  
import { RefreshEvent } from 'lightning/refresh';  
  
export default class BlankRecordPage extends LightningElement {  
    subscription = null;  
    @api recordId;  
  
    @wire(MessageContext)  
    messageContext;  
  
    subscribeToMessageChannel() {  
        this.subscription = subscribe(  
            this.messageContext,  
            Blank_Channel,  
            (message) => this.handleMessage(message)  
        );  
    }  
  
    handleMessage(message) {  
        console.log('接收LMS消息:', message);  
        if (message.recordId == this.recordId) {  
            this.handleRefresh();  
        }  
    }  

    handleRefresh() {  
        this.dispatchEvent(new RefreshEvent());  
    }  

    unsubscribeToMessageChannel() {  
        unsubscribe(this.subscription);  
        this.subscription = null;  
    }  

    connectedCallback() {  
        this.subscribeToMessageChannel();  
    }  

    disconnectedCallback() {  
        this.unsubscribeToMessageChannel();  
    }  
}
<?xml version="1.0" encoding="UTF-8"?>  
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">  
    <apiVersion>58.0</apiVersion>  
    <description>Blank Record Page</description>  
    <isExposed>true</isExposed>  
    <masterLabel>空白组件(刷新、弹窗)</masterLabel>  

    <targets>  
        <target>lightning__RecordPage</target>  
    </targets>  
</LightningComponentBundle>

3.在快速操作的LWC中,发布LMS消息

import {LightningElement,api,wire} from 'lwc';  
import { publish, MessageContext } from 'lightning/messageService';  
import Blank_Channel from '@salesforce/messageChannel/blankChannel__c';

export default class xxx extends LightningElement {
    @wire(MessageContext)  
    messageContext;

    @api recordId;
    
    handlePublish() {
        let payload = {  
            recordId: this.recordId  
        }  
        publish(this.messageContext, Blank_Channel, payload);
    }
}

参考链接:Refresh Standard Related List in LWCLightning Message Service