Vue.js中如何将v-model与方法绑定

Question

我正在学习vuejs（3）。

我有这个循环：

<tr v-for="index in 7" :key="index">
            <td>
              {{ index }} {{ getDayOfTheWeek ? getDayOfTheWeek(index) : null }}
            </td>
            <td>
              <input type="time" class="form-control" id="time_slot1_start" v-model="getTimeSlot1Start(index)" />
            </td>

而函数getTimeSlot1Start的声明如下：

methods: {

getTimeSlot1Start (day) {
      return this.openingHours.find(i => i.day === day).time_slot1_start
    },

当我想保存我的文件时，eslint告诉我：

错误 'v-model'指令需要作为LHS有效的属性值 vue/valid-v-model

为什么我会收到这个消息？无法将模型与函数绑定吗？

Answer 1

v-model指令是双向绑定的，它接受一个属性作为值而不是一个方法，你可以使用value属性和@input事件绑定该方法来编辑指定索引的项目：

<input ...  :value="getTimeSlot1Start(index)" @input="setTimeSlot1Start(index)" />