本篇参考:
https://developer.salesforce.com/docs/component-library/bundle/lightning-emp-api/documentation
salesforce零基础学习(九十六)Platform Event浅谈
Salesforce LWC学习(五) LDS & Wire Service 实现和后台数据交互 & meta xml配置背景: 我们在记录的详情页面,除标准的layout以外,实际工作中也会添加各种各样的component来满足实际业务的需要,有一些是标准组件,有一些是自定义组件。自定义组件间的修改和交互很好弄,我们可以通过 notifyRecordUpdateAvailable搞定(Lighting Data Service)LDS的缓存问题,通过 refreshApex搞定 call apex方法的问题,通过 dispatchEvent / handler方式来搞定父子组件通信的事情,通过pub / sub事件模型来搞定跨组件通讯问题,通过 lightning message service或者 dynamic interaction也可以搞定跨组件通讯问题。如上的内容都是自定义组件之间或者自定义组件的行为渲染到标准组件。那我们如何针对标准组件的更新作用到自定义页面,然后自定义页面捕捉到这些事件操作呢? 本篇提供两种思路。
需求: 当用户在Account详情页面更新数据时,不管使用 quick action的Edit还是 Inline Edit,当Account的Name包含Test的字样,显示一个toast信息。
一. 基于Lightning Data Service(LDS)
这个demo可以基于getRecord的这个wire adapter来实现。因为 getRecord以及标准UI都共用同一个version的数据,所以当标准UI因为用户修改以后,我们通过 getRecord也同样可以自动收到最新的version的数据,所以我们可以基于 getRecord的这个wire adapter来实现。
import { LightningElement, api, wire } from 'lwc'; import { ShowToastEvent } from 'lightning/platformShowToastEvent'; import { getRecord } from 'lightning/uiRecordApi'; import NAME_FIELD from "@salesforce/schema/Account.Name"; export default class toastDemo extends LightningElement { @api recordId; @wire(getRecord, { recordId: '$recordId', fields: [NAME_FIELD]}) // eslint-disable-next-line no-unused-vars wiredAccount(data, error) { if (data.data && data.data.fields && data.data.fields.Name) { if(data.data.fields.Name.value.includes('test')) { this.showToast(); } } else if(error) { console.log('error'); } } showToast() { const evt = new ShowToastEvent({ message: 'Name contains test', variant: 'info', }); this.dispatchEvent(evt); } }