Sending Messages to the Lightning Container Component

Use the methods in the lightning-container NPM module to send messages from the JavaScript code framed by lightning:container.

The Lightning-container NPM module provides methods to send and receive messages between your JavaScript app and the Lightning container component. You can see the lightning-container module on the NPM website.

Add the lightning-container module as a dependency in your code to implement the messaging framework in your app.
import LCC from 'lightning-container';

lightning-container must also be listed as a dependency in your app’s package.json file.

The code to send a message to lightning:container from the app is simple. This code corresponds to the code samples in Sending Messages from the Lightning Container Component and Handling Errors in Your Container, and can be downloaded from the Developerforce Github Repository.
sendMessage() {
  LCC.sendMessage({name: "General", value: this.state.messageToSend});
}

This code, part of the static resource, sends a message as an object containing a name and a value, which is user-defined.

When the app receives a message, it’s handled by the function mounted by the addMessageHandler() method. In a React app, functions must be mounted to be part of the document-object model and rendered in the output.

The lightning-container module provides similar methods for defining a function to handle errors in the messaging framework. For more information, see lightning-container NPM Module Reference