How Component will communicate through Lightning Message Service (LMS) in LWC
Define Message Channel Metadata in your org
- Make a folder under force-app/main/default with name “messageChannels”.
- Create an xml file “messageChannelName.messageChannel-meta.xml”
- Define lightning message field in .xml file, see code below
<?xml version="1.0" encoding="UTF-8"?>
<LightningMessageChannel xmlns="http://soap.sforce.com/2006/04/metadata">
<masterLabel>SampleMessageChannel</masterLabel>
<isExposed>true</isExposed>
<description>This is a sample Lightning Message Channel.</description>
<!--A list of message payload fields for a given Lightning Message Channel.-->
<lightningMessageFields>
<fieldName>recordId</fieldName>
<description>This is the record Id that changed</description>
</lightningMessageFields>
<lightningMessageFields>
<fieldName>recordData</fieldName>
<description>The current data representing the record that changed</description>
</lightningMessageFields>
</LightningMessageChannel>
Import message service
import msgService from '@salesforce/messageChannel/messageChannelName__c';
Import message service features
import {publish,subscribe,unsubscribe,APPLICATION_SCOPE,MessageContext} from 'lightning/messageService';
Define the Scope of the Message Service
The Lightning message service lets you define the scope of where subscribing components receive messages in your application.
For Lightning web components, the scoping feature is available only when using @wire adapter@wire(MessageContext)
messageContext
Publish Message Channel
To publish message, we have publish() method in Lightning message service’s.
publish() method accept 3 parameter :-
1. Message Context (Type Object)
2. Message Channel (Type Object)
3. Message Payload (The message payload is a JSON object)
messageContext :- The MessageContext
object provides information about the Lightning web component that is using the Lightning message service. Get this object via the MessageContext
wire adapter or via createMessageContext()
.
@wire(MessageContext)
messageContext
messageChannel :- The message channel object. To import a message channel, use the scoped module @salesforce/messageChannel
. To create a message channel in an org, use the LightningMessageChannel metadata type.
message :- A serializable JSON object containing the message published to subscribers. A message can’t contain functions or symbols.
Subscribe Message Channel
To subscribe message channel, use subscribe() method
subscribe() method accept 4 parameters :-
1. Message Context (Type Object)
2. Message Channel (Type Object)
3. Listener (Type function)
4. Subscriber Options (Type Object)
messageContext :- The MessageContext
object provides information about the Lightning web component that is using the Lightning message service. Get this object via the MessageContext
wire adapter or via createMessageContext()
.
@wire(MessageContext)
messageContext
messageChannel :- The message channel object. To import a message channel, use the scoped module @salesforce/messageChannel
. To create a message channel in an org, use the LightningMessageChannel metadata type.
listener :- A function that handles the message once it is published.
subscriberOptions :- (Optional) An object that, when set to {scope: APPLICATION_SCOPE}
, specifies the ability to receive messages on a message channel from anywhere in the application. Import APPLICATION_SCOPE
from lightning/messageService
.
Un-Subscribe Message Channel
To unsubscribe message channel, use unsubscribe() method
It accept 1 parameter
subscription :- The Subscription object returned by the subscribe()
function.
Demonstration
Message Channel

LSM_Component_A


LMS_Component_B


Result

Follow me on linkedIn and Twitter for such more related post
Comments
Post a Comment