0

I am working with spinner and this spinner should executive on based on the start and stop of @wire service async callout. Could I get help to find the @wire async callout promise instance? so based on this instance I will executive my spinner logic.

For example: for Apex Method Imperatively function

    createAccount() {
    const fields = this.fields;
    const recordInput = { apiName: 'Account', fields };
    let callout  = createRecord(recordInput)
      .then(account => {
        this.accountId = account.id;
      });
    this.loadSpinner(callout);
  }

 loadSpinner(callout){
    this.spinner = true;
    callout.finally(() => { this.spinner = false });
}

This is how I am executing the spinner from Apex Method Imperatively function but unfortunately, I am not able to find the same for the @wire service.

1 Answer 1

1

Create a property that controls the render state of your spinner and set it's default value to true.

JS

@track isLoading = true;
@wire(/*METHOD*/)
wireThings(response) {
    const wiredMethod = response;
    const {data,error} = response;
    if(data) {
        this.isLoading = false;
    }
    if(error) {
        this.isLoading = false;
        console.error(error);
    }
}

HTML

<lightning-spinner if:true={isLoading}></lightning-spinner>

This property can be toggled for any subsequent callouts.

Hope this helps

1
  • Sorry, this would not help me. let's say If I have 4 dynamic parameters and it has 4 different on change function and each function i would need to add the isLoading = true;. In the future, if I create a new parameter then I would need to change spinner logic again. I am looking very generic function that would handle automatically the spinner load. Thank you replyed me Sep 17, 2020 at 7:18

You must log in to answer this question.

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