需要更新LWC中的Picklist值的表



有一个将信息传递给子组件的帐户列表。需要更改picklist的值(handleChange中的valueType(,帐户列表也会更改,并将更新的信息传递给子组件。现在在list.js中处理Change,只更新valueType。

listController.cls

public with sharing class listController {

@AuraEnabled (cacheable = true)
public static List<Account> getAccList(String valueType){
String key = '%' + valueType + '%';
if (valueType != null && valueType != ''){
return [SELECT Id, Name, image__c, (SELECT Name FROM Users), Budget__c, NumberOfEmployees, Type, Description, Industry FROM Account WHERE Type LIKE :key ];
} else {
return [SELECT Id, Name, image__c, (SELECT Name FROM Users), Budget__c, NumberOfEmployees, Type, Description, Industry FROM Account];
}
}
}

list.html

<template>
<lightning-card>

<template if:true={TypePicklistValues.data}>
<lightning-combobox name="progress"
label="Type"
value={valueType}
placeholder="-Select-"
options={TypePicklistValues.data.values}
onchange={handleChange} >
</lightning-combobox>
</template><br/>
<template if:true={accounts.data}>

<div class = "container">
<div class="slds-box slds-p-around_none slds-m-top_x-small slds-m-bottom_medium slds-m-horizontal_none">
<lightning-layout multiple-rows> 

<template for:each={accounts.data} for:item="account">

<c-tile 
key={account.id} 
account={account} 
ontileclick={handleTileClick}>
</c-tile>


</template>

</lightning-layout>
</div>
</div>   
</template>
</lightning-card>

</template>

list.js

import { LightningElement, wire, api, track } from 'lwc';
import getAccList from '@salesforce/apex/listController.getAccList';
import { getPicklistValues } from 'lightning/uiObjectInfoApi';
import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import Type_FIELD from '@salesforce/schema/Account.Type';
import getValueType from '@salesforce/apex/listController.getValueType';
export default class List extends LightningElement {
@wire(getAccList) accounts;
@wire(getValueType) apexValueType;


@api valueType;
@track apexValueType;
@wire(getObjectInfo, { objectApiName: ACCOUNT_OBJECT })
objectInfo;
@wire(getPicklistValues, { recordTypeId: '$objectInfo.data.defaultRecordTypeId', fieldApiName: Type_FIELD})
TypePicklistValues;
handleChange(event) {
this.valueType = event.detail.value;
getAccList({valueType:this.valueType});


}
handleTileClick(evt) {


// This component wants to emit a productselected event to its parent
const event = new CustomEvent('accountselected', {
detail: evt.detail,


});
// Fire the event from c-list
this.dispatchEvent(event);
}
}

似乎您想从getAccList方法访问帐户记录,并将valueType作为筛选器。

当您在handleChange中对getAccList执行命令式调用时,它不会自动更新属性值,因为它应该返回promise。

要解决这个问题,解决方案如下:

要么使用,然后catch来处理响应赋值给class属性。

使用参数化导线作为

@wire(getAccList, { valueType: '$valueType'}) accounts;

这将根据值类型过滤器自动为账户记录提供服务,自动更改值类型值

最新更新