2

When I am making a bear tracking app this problem arises in the last module. Error - afterRender threw an error in 'c:bearMap' [lightning/messageService: The scope property is required. When you call subscribe, include the scope property and set the value to APPLICATION_SCOPE. Format the call to subscribe as subscribe(<context>, <channel>, <listener>, { scope: APPLICATION_SCOPE }). Import APPLICATION_SCOPE from lightning/messageService.]

Bear tracking App

bearmap.js file-

import { LightningElement, wire } from 'lwc';
import { subscribe, unsubscribe, APPLICATION_SCOPE, MessageContext } from 'lightning/messageService';
//import recordSelected from '@salesforce/messageChannel/Record_Selected__c';
import BEAR_LIST_UPDATE_MESSAGE from '@salesforce/messageChannel/BearListUpdate__c';
export default class BearMap extends LightningElement {
  mapMarkers = [];
  subscription = null;
  @wire(MessageContext)
  messageContext;
  connectedCallback() {
    // Subscribe to BearListUpdate__c message
    this.subscription = subscribe(
        this.messageContext,
        BEAR_LIST_UPDATE_MESSAGE,
        (message) => {
            this.handleBearListUpdate(message),
            { scope: APPLICATION_SCOPE }
        });
  }
  disconnectedCallback() {
    // Unsubscribe from BearListUpdate__c message
    unsubscribe(this.subscription);
    this.subscription = null;
  }
  handleBearListUpdate(message) {
    this.mapMarkers = message.bears.map(bear => {
      const Latitude = bear.Location__Latitude__s;
      const Longitude = bear.Location__Longitude__s;
      return {
        location: { Latitude, Longitude },
        title: bear.Name,
        description: `Coords: ${Latitude}, ${Longitude}`,
        icon: 'utility:animal_and_nature'
      };
    });
  }
}
2
  • The error tells you the problem.
    – sfdcfox
    Jul 15, 2020 at 21:55
  • But I don't know how to resolve it. Jul 15, 2020 at 21:56

1 Answer 1

1

You actually made a pretty easy error. The {} surrounding the object that's meant to be a parameter placed it inside the function body of the arrow function:

(message) => {
        this.handleBearListUpdate(message),
        { scope: APPLICATION_SCOPE }
    }

What you meant is:

this.subscription = subscribe(
    this.messageContext,
    BEAR_LIST_UPDATE_MESSAGE,
    (message) => this.handleBearListUpdate(message),
    { scope: APPLICATION_SCOPE }
);

To understand what happened, read the arrow function and comma operator documentation.

1
  • Yes it has resolved my problem. Thanks for the help. Jul 15, 2020 at 22:19

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .