刷新 table 祝你好运
Refresh table LWC
当我使用 lightning-record-form 更新帐户记录时,我一直在尝试重新呈现 table。
我试着用我在这里发现的类似问题来寻找解决方案,但我仍然无法实现。
在这种情况下,我使用名称 'Gonzalo' 的帐户对 recordId 进行了硬编码,显示在所有代码下方的预览中。所以想要的结果是更新帐户名称或任何字段并在 table 中查看即时结果。
这是我的代码:
- Apex 方法(以防万一):
@AuraEnabled(cacheable=true)
public static List<Account> getCuentas() {
return [SELECT id, Name, Phone FROM Account LIMIT 5];
}
- 表格(HTML):
<lightning-record-form
object-api-name="Account"
record-id="0015e00000F2JoWAAV"
fields={fields}
onsubmit={handleSubmit}
>
</lightning-record-form>
- Table (HTML):
<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>
- 相关代码(JS):
***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);
}
组件预览:
- Table
- Form
看起来像是缓存问题。
我们可以通过以下几种方式解决这个问题:
- 删除可缓存
您需要删除 (cacheable=true)
,然后必须在每次表单更新或加载初始数据时强制调用 apex 方法。
- 在 apex 方法中创建一个不必要的参数,每次调用都会有新的值
您需要在 apex 方法中接收一个附加参数作为整数,然后在 lwc 中创建一个 var 将其初始化为 0,并在每次更新时将其递增 1。
然后使用相同的 var 通过线路或在命令式调用中调用 apex 方法。
当我使用 lightning-record-form 更新帐户记录时,我一直在尝试重新呈现 table。 我试着用我在这里发现的类似问题来寻找解决方案,但我仍然无法实现。 在这种情况下,我使用名称 'Gonzalo' 的帐户对 recordId 进行了硬编码,显示在所有代码下方的预览中。所以想要的结果是更新帐户名称或任何字段并在 table 中查看即时结果。 这是我的代码:
- Apex 方法(以防万一):
@AuraEnabled(cacheable=true)
public static List<Account> getCuentas() {
return [SELECT id, Name, Phone FROM Account LIMIT 5];
}
- 表格(HTML):
<lightning-record-form
object-api-name="Account"
record-id="0015e00000F2JoWAAV"
fields={fields}
onsubmit={handleSubmit}
>
</lightning-record-form>
- Table (HTML):
<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>
- 相关代码(JS):
***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);
}
组件预览:
- Table
- Form
看起来像是缓存问题。
我们可以通过以下几种方式解决这个问题:
- 删除可缓存
您需要删除 (cacheable=true)
,然后必须在每次表单更新或加载初始数据时强制调用 apex 方法。
- 在 apex 方法中创建一个不必要的参数,每次调用都会有新的值
您需要在 apex 方法中接收一个附加参数作为整数,然后在 lwc 中创建一个 var 将其初始化为 0,并在每次更新时将其递增 1。
然后使用相同的 var 通过线路或在命令式调用中调用 apex 方法。