Lightning Web Components – Understanding Order of Execution in LWC Lightning Quick Action

lightning-quickactionlightning-web-componentsorder-of-execution

Update: I implemented a .then() as suggested by Shubham, there were two good suggestions and for anyone who reads this in future this is a good article comparing them: https://beyondthecloud.dev/blog/then-vs-async-await-in-lwc

In short: using async/await forces the call to be synchronous, and then/catch just makes whatever is in then to wait for the first call.

I'm building an import for records from a CSV. When handling smaller files the order of execution is incorrect. This is an LWC being used as a Lightning Quick Action.

First thing is a call to an Apex method to delete the existing records associated with the account this lightning quick action was called on.

Secondly I chunk the file and send those chunks to an Apex method for processing and storing.

Even though the call to delete is first the execution log shows that the "Upload Chunk" call was processed first. It is important that the records are deleted first. Otherwise some records could be uploaded then immediately deleted.

I know I can just add a delay before the import starts to allow the first call to complete, but I want to see what other options there are.

Code to handle parsing file

Dev Console Execution Log

Best Answer

What you can do is call your deletePartnerMembers apex function with .then() & .catch() & do your further processing in then-callback like this-

deletePartnerMembers ({partnerId: self.recordId})
  .then (() => {
    // code to further processing
  })
  .catch (() => {
    //error handling
  });

It'll wait for deletePartnerMembers to get executed completely.

Related Topic