4

我正在生成一个包含多个输入元素的列表,其中一个是<el-select>. 在更改此选择菜单时,我得到了与该选择有关的值。但在这里,问题是,我还想获取父 v-for 项目的索引/行号。您可以从以下代码中理解我的意思:

<el-form-item v-for="(domain, index) in Prescription.domains">
    <div class="col-md-2" v-if="medicineIsSelected === true">
        <small>Select Brand:</small>
        <el-select v-model="domain.SelectedBrand" clearable placeholder="Select" @change="updateDropdowns"> <!-- Here I want to pass {{index}} also -->
          <el-option
            v-for="item in selectedMedicineMetaInfo.BrandName"
            :key="item.value.name"
            :label="item.value.name"
            :value="item.value.rxcui">
          </el-option>
        </el-select>
    </div>
</el-form-item>

从上面的代码可以看出,我想在updateDropdowns. 我尝试传递 updateDropdowns(index),在这里我得到了索引号,但丢失了该下拉列表的选定值。我怎样才能通过两者?

4

3 回答 3

6

这是解决方案:

@change="updateDropdowns(index, $event)"

您可以使用 $event 来引用当前事件。

于 2018-07-05T10:32:18.047 回答
0

您可以使用自定义事件来管理它

<div>
   <child @clicked="ongetChild"></child>
</div>

==孩子==

观察你的下拉菜单变化

export default {
 watch: {
 'domain.SelectedBrand':function(value) {
   this.$emit('clicked', 'value')
 }
}}

=== 父母 ==

export default {
 ongetChild (value) {
  console.log(value) // someValue
  }
 }
}
于 2018-07-05T09:18:50.460 回答
0

@change="updateDropdowns"el-select标签中使用

使用vue方法:

updateDropdowns(index) {
    this.selectedMedicineMetaInfo.BrandName[index-1]; // this gives selected option details
}
于 2020-06-18T06:17:32.697 回答