September 20, 2023

Syntax: import { refreshApex } from ‘@salesforce/apex’;

Apex Class

public class AccountHelper {
    @AuraEnabled(cacheable=true)
    public static List<Account> getAccountList() {
        List<Account> accountList= [SELECT Id, Name, Phone, Email FROM Account LIMIT 10];
        return accountList;
    }
     
    @AuraEnabled
    public static void deleteAccount(String accountId) {
        Database.delete(accountId);
    }
}

refreshApexLWC.html

<template>
    <lightning-card title="Account List" icon-name="standard:account">
        <template if:true={accounts}>
            <table class="slds-table slds-table_cell-buffer slds-table_bordered slds table_striped">
                <thead>
                    <tr class="slds-text-heading_label">
                        <th scope="col">Name</th>
                        <th scope="col">Industry</th>
                        <th scope="col">Phone</th>
                        <th scope="col">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    <template for:each={accounts} for:item="account">
                        <tr key={account.Id}>
                            <td data-label="Name">{account.Name}</td>
                            <td data-label="Industry">{account.Industry}</td>
                            <td data-label="Phone">{account.Phone}</td>
                            <td data-label="Actions">
                                <lightning-button-icon icon-name="utility:delete" variant="border-filled"
                                    alternative-text="Delete"
                                    title="Delete"
                                    onclick={handleDelete}
                                    data-account-id={account.Id}></lightning-button-icon>
                            </td>
                        </tr>
                    </template>
                </tbody>
            </table>
        </template>
        <template if:true={error}>
            <!-- Handle error display -->
        </template>
    </lightning-card>
</template>

refreshApexLWC.js

import { LightningElement, wire } from 'lwc';
import { refreshApex } from '@salesforce/apex';
import getAccounts from '@salesforce/apex/AccountHelper.getAccounts';
import deleteAccount from '@salesforce/apex/AccountHelper.deleteAccount';
export default class RefreshApexLWC extends LightningElement {
    @track accounts;
    @track error;
    @track wiredAccountResult;
    
    @wire(getAccounts)
    wiredAccounts( result ) {
        this.wiredAccountResult=result;
        if (result.data) {
            this.accounts = result.data;
            this.error = undefined;
        } else if (result.error) {
            this.accounts = undefined;
            this.error = result.error;
        }
    }
    
    handleDelete(event) {
        const accountId= event.target.dataset.accountId;
        deleteAccount({ accountId })
            .then(() => {
                // Perform any success actions if needed
                refreshApex(this.wiredAccountResult);
            })
            .catch((error) => {
                // Handle the error if deletion fails
            });
    }
}

refreshApex in LWC

Communication between components in LWC

5 2 votes

Article Rating

Subscribe

Login

Notify of

new follow-up comments new replies to my comments

Label

{} [+]

Name*

Email*

Website

Label

{} [+]

Name*

Email*

Website

0 Comments

Oldest

Newest Most Voted

Inline Feedbacks

View all comments