Question

我正在尝试制作一个依赖于另一个的选项列表控制器选项列表：子类型从属选项列表我成功了我把它放在闪电组件中

<ui:inputSelect aura:id="conType" label="Type" class="slds-select" change="{!c.onControllerFieldChange}" value="{!v.TypeV}">
<ui:inputSelect aura:id="conSubtype" label="Sub Type" value="{!v.SubTypeV}" disabled="{!v.isDependentDisable}" class="slds-select"  />

我把这个组件放在另一个闪电组件

中

DependentSubtype是子组件 TypeV子组件属性初始化控制器选项列表的值（类型） SubTypeV子组件属性，用于初始化从属选项列表（SubType）的值

对于Controller选取列表（Type），初始化起作用但对于依赖的picklis（子类型），它并没有提前致谢

Answer 1

看来，您的方法是正确的，但是，仅凭这两行代码很难指出问题所在。这是依赖选择列表的一种方法，

// controller.js
({
  doInit : function(component, event, helper) {
    helper.loadOption1(component, event);
  },
  
  changeSecondPicklist : function(component, event, helper) {
    helper.populateOption2(component, event);
  }
})

// helper.js
({
  loadOption1 : function(component, event) {
    var option = [];
    option.push('Type1.1');
    option.push('Type1.2');
    option.push('Type1.3');
    component.set('v.option1', option);
  },
  
  populateOption2 : function(component, event) {
    var value = event.getParam('value');
    var option = [];
    if (value == 'Type1.1') {
      option.push('SubType1.1');
      option.push('SubType1.2');
      option.push('SubType1.3');
    }
    else if (value == 'Type1.2') {
      option.push('SubType2.1');
      option.push('SubType2.2');
      option.push('SubType2.3');
    }
    else {
      option.push('SubType3.1');
      option.push('SubType3.2');
      option.push('SubType3.3');
    }
    component.set('v.option2', option);
  }
})

<!-- lightning component -->
<aura:component>
  <aura:attribute name="option1" type="String[]" />
  <aura:attribute name="option2" type="String[]" />
  <aura:handler name="init" value="{!this}" action="{!c.doInit}" />

  <lightning:select name="select1" label="Type" required="true" onchange="{!c.changeSecondPicklist}">
    <option value="">choose one...</option>
    <aura:iteration items="{!v.option1}" var="item">
      <option value="{!item}">{!item}</option>
    </aura:iteration>
  </lightning:select>

  <lightning:select name="select2" label="SubType" required="true">
    <option value="">choose one...</option>
    <aura:iteration items="{!v.option2}" var="item">
      <option value="{!item}">{!item}</option>
    </aura:iteration>
  </lightning:select>
</aura:component>

在这里我使用了 lightning 标签，因为Salesforce将不再支持 ui 标签。逻辑是第一个选择列表的 onchange 事件会填充从属选择列表的选项。

设置独立选项列表的值

1 个答案: