1

I'm using Apex to query data directly from Apex. I have the Wire Service working correctly for HTML, but I want to be able to record my data to an array in my LWC JavaScript file. Am I missing something or doing it wrong? Should I create a method instead?

LWC JS Code:

import { LightningElement, wire } from 'lwc';

// Importing from the "MapMarkers.js" file.
import { MapMarkers } from './MapMarkers';

// Importing from the "mappingBox" LWC.
import { SearchString, SearchState } from 'c/mappingBox';

// Importing from the "messageChannels" folder.
import { subscribe, MessageContext } from 'lightning/messageService';
import COUNTER_FILE from '@salesforce/messageChannel/updatecounter__c';

// Importing Apex "QueryData" code, to get Opportunity object and fields data.
import getOpportunityList from '@salesforce/apex/QueryData.getOpportunityList';

// -----------------------------------------------------------------------------

// Global Variables.
let SearchStreet = '20 abc St';
let SearchCity = 'boston';

var myArray = [];

export default class Mapping extends LightningElement {

    // ** Still in work **

    @wire(getOpportunityList) 
    opportunities;

    myArray = this.opportunities;

Apex Code:

public with sharing class QueryData {
    
    @AuraEnabled(cacheable=true)
    public static List<Opportunity> getOpportunityList() {
    
        List<Opportunity> OppList = new List<Opportunity>();
        OppList = [SELECT Id, Service_Address__c, Development_Rep__c, Name, Project_Type__c, CloseDate FROM Opportunity LIMIT 5];
    
        return OppList;
    
    }
  
}

Refined Question: The reasons why I didn't create a method was that I need to be able to past this array to the "MapMarkers.js" file, and I don't think a LWC method can be import correctly to a JavaScript file.

Improve this question

1 Answer 1

Reset to default
5

Wire methods are asynchronous. That means you can't get the data during the construction of your component; myArray = this.opportunities; executes before getOpportunityList does. If you want to do anything with the data in Javascript, you need to wait for the data to load. Alternatively, using a wire handler allows you to correctly set the data when it is available.

    myArray;
    @wire(getOpportunityList) handleGetOpportunityList(response) {
      if(response.data) {
        this.myArray = response.data;
      }
    }

Or the construction you'll find in the documentation:

    myArray;
    @wire(getOpportunityList) handleGetOpportunityList({ data, error }) {
      if(data) {
        this.myArray = data;
      }
    }

Note that the data property will be read-only, so you will need to copy the data before you can use.

Improve this answer
6
  • So, I'm trying to use the first code you gave me, but I am getting a error message called: "Cannot read properties of undefined (reading 'data')" Commented Apr 17, 2023 at 15:45
  • Sorry ignore the first comment, I found out the error, it was in my HTML file. Thanks! Commented Apr 17, 2023 at 16:03
  • I am still getting empty data for "myArray", when I call it via alert("Test:" + myArray);. Any idea? Should I be calling the method? Commented Apr 17, 2023 at 16:07
  • 1
    @Pinto The method is called for you. You're trying to access the data too early. Commented Apr 17, 2023 at 16:18
  • When or how should I access the data, so I can import it to my MapMarkers.js file? Commented Apr 17, 2023 at 18:17

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.