Question

如何在以下代码中的方法row.question_id中获取option.AnswerMasterID和selectChange的值？我正在使用Vue.js v2。

<div v-if="row.answer_input_type === 'Dropdown'">
  <template v-for="answer in answers">
    <template v-if="answer.AnswerTypeID === row.answer_type_id">
      <select class="dropdown_cl" v-bind:disabled="row.is_enabled == 1 ? false : true" @change="selectChange(row.question_id, answer.AnswerDescription)">
        <option v-for="option in answer.AnswerDescription" v-bind:value="option.AnswerMasterID"   >{{option.AnswerDescription}}</option>
      </select>
      <p v-for="option in answer.AnswerDescription">{{option.AnswerMasterID}}</p>
    </template>
  </template>
</div>

我的方法如下：

selectChange: function (question_id, ans_master_id) {
  alert(question_id + " " + ans_master_id)
},

我想得到内部循环中option.AnswerMasterID的值。

Answer 1

在select元素上使用v-model指令将数据属性绑定到它：

<select class="dropdown_cl" v-model="selectedID" ...

确保将selectedID添加到数据属性：

data() {
  return {
    selectedID: null,
  }
}

由于您已将option.AnswerMasterID绑定为每个选项的值，因此selectedID将绑定到所选选项的AnswerMasterID。

然后，您可以在selectChange方法中引用此值：

selectChange: function (question_id) {
  alert(question_id + " " + this.selectedID);
},

Here is Vue's documentation for select input binding.

将值发送到VueJS 2中的方法

1 个答案: