LW C - значения объекта оболочки обнуляются при изменении значения входного тега - PullRequest
Новая
       70

LW C - значения объекта оболочки обнуляются при изменении значения входного тега

1 голос
/ 29 мая 2020

У меня есть метод Apex, который возвращает список классов оболочки как JSON строка

с контроллером LW C js для вызова метода в connnectedCallback(), а список оболочки назначается свойство this.coreAttributes, которое отображается на странице html с использованием базовых тегов c html вместе с другим свойством, определенным в LW C noOfBlocks, faltHierarchy и еще одним. код приведен ниже.

Когда я ввожу какое-то значение в поле ввода coreAttribute's и ввожу какое-то значение в поле ввода noOfBlocks, значение, введенное в поля coreAttribute, исчезает. пожалуйста, проверьте прикрепленный gif и помогите мне решить эту проблему.

Изображение: https://easyupload.io/g1h772

@AuraEnabled(cacheable=true)
    public static String queryCoreAttributes() {
        List<Core_Attribute__c> coreAttributesList = new List<Core_Attribute__c>();
        Map<Id,List<String>> picklistValuesToPicklistMasterMap = new Map<Id,List<String>>();

        coreAttributesList = [SELECT Id, Name, Data_Type__c, Type__c, Picklist_Master__c 
            FROM Core_Attribute__c WHERE Base_Asset_Name__c IN (SELECT Id FROM Base_Asset_Template__c WHERE Name = 'Base PV Plant') 
            ORDER BY Name ASC];

        picklistValuesToPicklistMasterMap = Utils.getPicklistValues(); 

        System.debug(' picklistValuesToPicklistMasterMap '+ picklistValuesToPicklistMasterMap);

        List<coreAttributesWrapper> coreAttributesWrapperList = new List<coreAttributesWrapper>();
        for(Core_Attribute__c coreAttribute : coreAttributesList){
            coreAttributesWrapper coreAttWrapper = new coreAttributesWrapper();
            coreAttWrapper.attributeHeader = coreAttribute.Name;
            coreAttWrapper.attributeDataType = coreAttribute.Data_Type__c.toLowerCase();
            coreAttWrapper.picklistValues = (coreAttribute.Data_Type__c == 'Picklist') ? picklistValuesToPicklistMasterMap.get(coreAttribute.Picklist_Master__c): null;
            coreAttWrapper.isPicklist = (coreAttribute.Data_Type__c == 'Picklist');
            coreAttWrapper.attributeValue = '';
            coreAttributesWrapperList.add(coreAttWrapper);
        }
        System.debug(' core Att '+ coreAttributesWrapperList);
        return JSON.serialize(coreAttributesWrapperList);
    }

JS

import { LightningElement, track, api } from "lwc";
import getPlantAssetRecord from "@salesforce/apex/P1PlantInfoPromptSolar.queryPlantAssetRecord";
import queryCoreAttributes from "@salesforce/apex/P1PlantInfoPromptSolar.queryCoreAttributes";
import saveP1PlantInfoPromptMetadata from "@salesforce/apex/P1PlantInfoPromptSolar.saveP1PlantInfoPromptMetadata";

export default class P1PlantInfoPromptSolar extends LightningElement {
  @api plantAssetId='';
  @track plantAssetDetail;
  @track coreAttributes;
  @track noOfBlocks='';
  @track flatHierarchy=false;
  @track drivePlus=false;
  @track promptSpecificAttributes;
connectedCallback() {
    console.log(' connected callback ');
    getPlantAssetRecord({
        recordId: 'a060p000001hGLxAAM',
    })
    .then(result => {
      this.plantAssetDetail = result;
    })
    .catch(error => {
      this.error = error;
    });

    queryCoreAttributes()
    .then(result => {
      console.log(' result ' + result);
      console.log(' JSON result ' + JSON.parse(result));
      this.coreAttributes = JSON.parse(result);
    }) 
    .catch(error => {
      this.error = error;
    });
  }

inputTagValueChangeHandler(event){
    console.log(' test '+ JSON.stringify(this.coreAttributes));
    console.log(' value -> '+ event.target.value + ' name -> ' + event.target.name);

    if(event.target.name === 'Blocks') this.noOfBlocks = event.target.value;
    if(event.target.name === 'Flat Hierarchy') this.flatHierarchy = event.target.value;
    if(event.target.name === 'Drive+') this.drivePlus = event.target.value; 
  }

HTML


    <tr data-row="1">
                  <th># Blocks</th>
                  <td><input type="number" name="Blocks" 
                    value={noOfBlocks} onchange={inputTagValueChangeHandler}/></td>
                </tr>
                <tr data-row="2">
                  <th>Flat Hierarchy</th>
                  <td><input type="checkbox" name="Flat Hierarchy" 
                    value={flatHierarchy} onchange={inputTagValueChangeHandler}/></td>
                </tr>
                <tr data-row="2">
                  <th>Drive+</th>
                  <td><input type="checkbox" name="Drive+" 
                    value={drivePlus} onchange={inputTagValueChangeHandler}/></td>
                </tr>
    <template for:each={coreAttributes} for:item="coreAttribute">
                  <tr key={coreAttribute.key}>
                    <th>{coreAttribute.attributeHeader}</th>
                    <td>
                      <template if:false={coreAttribute.isPicklist}>
                        <input type={coreAttribute.attributeDataType} name={coreAttribute.attributeHeader}
                         value={coreAttribute.attributeValue}/>
                      </template>
                      <template if:true={coreAttribute.isPicklist}>
                        <select size="1" name={coreAttribute.attributeHeader}>
                          <option value="None">--None--</option>
                          <template for:each={coreAttribute.picklistValues} for:item="attributePickValues">
                            <option key={coreAttribute.key} value={coreAttribute.attributeValue}>{attributePickValues}</option>
                          </template>
                        </select>
                      </template>
                    </td>
                  </tr>
                </template>
...