刷新 table 祝你好运

Refresh table LWC

当我使用 lightning-record-form 更新帐户记录时,我一直在尝试重新呈现 table。 我试着用我在这里发现的类似问题来寻找解决方案,但我仍然无法实现。 在这种情况下,我使用名称 'Gonzalo' 的帐户对 recordId 进行了硬编码,显示在所有代码下方的预览中。所以想要的结果是更新帐户名称或任何字段并在 table 中查看即时结果。 这是我的代码:

@AuraEnabled(cacheable=true)
    public static List<Account> getCuentas() {
        return [SELECT id, Name, Phone FROM Account LIMIT 5];
    }
    <lightning-record-form
              object-api-name="Account"
              record-id="0015e00000F2JoWAAV"
              fields={fields}
              onsubmit={handleSubmit}
              >
            </lightning-record-form>
<lightning-datatable 
            key-field="pk"
            data={cuentas}
            columns={columnas}
            onrowselection={action}
            hide-checkbox-column
            onrowaction={handleRow}
            default-sort-direction={defaultSortDirection}
            sorted-direction={sortDirection}
            sorted-by={sortedBy}
            onsort={onHandleSort}
            >
          </lightning-datatable>
***Imports***
import { refreshApex } from '@salesforce/apex';
import NAME from '@salesforce/schema/Account.Name';
import PHONE from '@salesforce/schema/Account.Phone';
import getCuentas from '@salesforce/apex/ProbandoJSON.getCuentas';
import { LightningElement, api, wire, track } from 'lwc';

***Vars for the form fields***
fields = [NAME, PHONE];

***Columns***
columnas = [
    {
      label: 'View',
      type: 'button',
      initialWidth: 75,
      typeAttributes: {
        label: {
          fieldName: 'Boton'
        },
        title: 'Preview',
        alternativeText: 'View',
        variant: 'border-filled'
      } 
    },
    {
      label: 'Name', 
      fieldName: 'Name',
      sortable: true
    },
    {
      label: 'Phone',
      fieldName: 'Phone'
    }
  ];

***Accounts***
@track cuentas = [];
  _wiredResult;
  @wire(getCuentas)
  wireCuentas(result) {
    this._wiredResult = result;
    if(result.data) {
      console.log('cuentas');
      console.log(result.data);
      
      for(var i in result.data) {
        let obj = {};
        obj.Id = result.data[i].Id;
        obj.Name = result.data[i].Name;
        obj.Phone = result.data[i].Phone;
        obj.Boton = parseInt(i) + 1;
        this.cuentas = [...this.cuentas, obj];
      }
      console.log('cuentas de nuevo');
      console.log(this.cuentas);
    } else if(result.error) {
      console.log('error cuentas');
      console.log(result.error);
    }
  }

***Submit handler for the Save button in the form***
handleSubmit(event) {
    console.log('saving...')
    return refreshApex(this._wiredResult);
  }

组件预览:

看起来像是缓存问题。

我们可以通过以下几种方式解决这个问题:

  1. 删除可缓存

您需要删除 (cacheable=true),然后必须在每次表单更新或加载初始数据时强制调用 apex 方法。

  1. 在 apex 方法中创建一个不必要的参数,每次调用都会有新的值

您需要在 apex 方法中接收一个附加参数作为整数,然后在 lwc 中创建一个 var 将其初始化为 0,并在每次更新时将其递增 1。

然后使用相同的 var 通过线路或在命令式调用中调用 apex 方法。