如何为 v-model 调用提供特定参数

Question

如何在 v-model 中给出数组天数的索引？

<select v-model="dayList" id="dayList">
    <option v-for="(day, index) in days" :key="index">{{ selectDaysLabel(day) }}</option>
</select>

并且：

dayList(index) {
  console.log(index) // should give you either 0, 1, 2...
}

感谢您的帮助！

Answer 1

您可以根据需要将 <option> 的值与特定数据类型绑定，例如 v-bind:value="{ 'data': day, 'index':index }"，或者您可以 v-bind:value="index".

new Vue({
    el: "#app",
    data: {
        selectedDay: '',
        days: ['A', 'B', 'C', 'D']
    },
    methods: {
      getSelect(){
        console.log(this.selectedDay ? this.selectedDay.index : 'No selection')
      }
    }
});

<script src="https://unpkg.com/vue@2.0.1/dist/vue.js"></script>
<div id="app">
<button v-on:click="getSelect()">Test</button>
<select v-model="selectedDay" >
    <option v-for="(day, index) in days" v-bind:value="{ 'data': day, 'index':index }">{{day}}</option>
</select>
</div>

如何为 v-model 调用提供特定参数

How can I give specific parameter to a v-model call

javascript

vue.js

vuejs2

v-model