如何为v模型调用提供特定参数

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>