종속 사용자 지정 Lightning 선택 목록 수준 2 및 수준 3을 설정 한 다음 Lightning 구성 요소에서 수준 2를 재설정하지만 수준 2 캐시 된 데이터가 저장됩니다.

Nov 16 2020

1 단계

Salesforce Lightning 구성 요소에 세 가지 수준의 종속 선택 목록이있는 시나리오가 있습니다. 먼저 선택 목록 Level1 및 Level2에 대한 값을 설정 한 다음 사용자가 Level3에서 종속 선택 목록 값을 선택합니다.

2 단계

Level2에서 선택을 제거하면 자동으로 Level3 선택도 지워집니다.

Step3

저장을 클릭하십시오.

여기에 문제가 있습니다. 1 단계에서 선택한 값이 2 단계에서 재설정 된 값이 아닌 저장됩니다.

값을 재설정하는 코드를 추가 ui:inputSelectOption했지만 번개 구성 요소의 재설정 값이 재설정되지 않고 저장을 클릭 한 후 저장된 오히려 캐시 된 값이 저장되는 것 같습니다.

번개 구성 요소가 현재 번개 구성 요소 값을 저장하는 대신 캐시 된 값을 저장하지 않도록 코드를 수정하는 데 도움을주세요.

다음은 구성 요소 코드입니다.

<aura:component controller="PickListHandler" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
  <!-- Actions-->
  <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
  <aura:handler name="change" value="{!v.pageReference}"
          action="{!c.onPageReferenceChanged}" />
  <!-- variable-->
  <aura:attribute name="lstLevel1" type="String[]" />
    <aura:attribute name="lstLevel2" type="String[]" />
    <aura:attribute name="lstL3" type="String[]" />
  <span> Level 1</span>
  <ui:inputSelect aura:id="ddLevel1" change="{!c.getLvl1}">
    <ui:inputSelectOption label="-Select-" value="true"/>        
    <aura:iteration items="{!v.lstLevel1}" var="value">          
      <ui:inputSelectOption label="{!value}" text="{!value}" />
    </aura:iteration>
  </ui:inputSelect>
  <span>Level 2</span>
  <ui:inputSelect aura:id="ddLevel2"  change="{!c.getSelectedValue}">
      <ui:inputSelectOption label="-Select-" value="{!v.clrlv1}"/>        
    <aura:iteration items="{!v.lstLevel2}" var="value">          
      <ui:inputSelectOption label="{!value}" text="{!value}" />
    </aura:iteration>
  </ui:inputSelect>
    <span>Level 3</span>
  <ui:inputSelect aura:id="ddLevel3" >
    <ui:inputSelectOption label="-Select-" value="{!v.clrlv2}"/>        
    <aura:iteration items="{!v.lstL3}" var="value">          
      <ui:inputSelectOption label="{!value}" text="{!value}" />
    </aura:iteration>
  </ui:inputSelect>
    <lightning:button variant="brand" label="Save" onclick="{!c.onConfirm}" />
</aura:component>

여기에 컨트롤러 코드가 있습니다

({
  reset1 : function(component, event, helper) {
      component.set("v.clrlvl", "");
    },
  reset2 : function(component, event, helper) {
      component.set("v.clrlv2", "");
    },onPageReferenceChanged: function(cmp, event, helper) {
      $A.get('e.force:refreshView').fire(); }, doInit : function(component, event, helper) { var action = component.get("c.getLevel1"); action.setCallback(this, function(e) { if(e.getState()=='SUCCESS'){ var result=e.getReturnValue(); component.set("v.lstLevel1",result); } }); $A.enqueueAction(action);
    },    
  getLvl1:function(component, event, helper){
        
      var picklist=component.find('ddLevel1');
      var picklistvalue=picklist.get('v.value');
      var action = component.get("c.getLevel2");
      action.setParams({  'strName' : picklistvalue  });
      action.setCallback(this, function(e) {
        if(e.getState()=='SUCCESS'){
          var result=e.getReturnValue();
          component.set("v.lstLevel2",result);
        }
      });
      $A.enqueueAction(action); }, getSelectedValue:function(component, event, helper){ var picklist=component.find('ddLevel1'); var picklistvalue=picklist.get('v.value'); var picklistdep=component.find('ddLevel2'); var picklistvaluedep2=picklistdep.get('v.value'); var action = component.get("c.getLevel3"); action.setParams({ 'strName1' : picklistvalue, 'strName2' : picklistvaluedep2});// action.setCallback(this, function(e) { if(e.getState()=='SUCCESS'){ var result=e.getReturnValue(); component.set("v.lstL3",result); } }); $A.enqueueAction(action);
    },
    onConfirm:function(component, event, helper){
      var picklist=component.find('ddLevel1');
      var picklistvalue=picklist.get('v.value');
      var picklistdep=component.find('ddLevel2');
      var picklistvaluedep2=picklistdep.get('v.value');
        
      var picklistdep3=component.find('ddLevel3');
      var picklistvaluedep3=picklistdep3.get('v.value');
      var action = component.get("c.savecasetype");
      
      action.setParams({  'level1' : picklistvalue,
                'level2' : picklistvaluedep2,
                'level3' : picklistvaluedep3,
                'id' : component.get("v.recordId")});
                
      
      var toastEvent = $A.get("e.force:showToast"); action.setCallback(this, function(e) { if(e.getState()=='SUCCESS'){ var result=e.getReturnValue(); if(result==='successfull'){ toastEvent.setParams({ "title": "Success!", "message": "The record has been inserted successfully." }); toastEvent.fire(); }else{ toastEvent.setParams({ "title": "Error", "message": "The record has not been inserted successfully." }); toastEvent.fire(); } } }); $A.enqueueAction(action);
        
    }
})

답변

CarolynCordeiro Nov 20 2020 at 00:36

이것은 내가 레벨 1 선택 목록을 변경하기 한 3 단계 선택 목록 새로 고침하지 때문에, 그래서 추가 고정있어 onchange에서Level3

또한 복사 getSelectedValue에서 도우미로 getLvl1사용하는 기능 helper.getSelectedValue(component,event,helper);( 그것은 헬퍼 클래스 중 하나를 잘 활용 기억 될 것입니다 그것의 더 나은 도우미에서 해당 기능을 넣어, 그래서 우리가 반복적으로 호출 할 몇 가지 코드 또는 방법을 필요로 할 때 이것이 에서)와 다시 호출 component또한 변경된 <ui:inputSelect새로운 아우라 구성 요소로<lightning:select