小程序 · <input>报错：<input v-model="item">: You are binding v-model directly...

报错来源：

input使用for循环：

<input v-for="(item,index) in list" :key="index" v-model="item"/>

实例：

  <div class="cu-form-group" v-for="(item,index) in appData.welcomeList" :key="index" >
    <input class='radius' :name="'welcome'+index" v-model="item"/>
    <button class='cu-btn bg-red shadow-blur sm' @click="deleteWelcome(index)">
      <span class='icon-delete'></span> </button>
  </div>

报错内容：

<input v-model="item">: You are binding v-model directly to a v-for iteration alias. This will not be able to modify the v-for source array because writing to the alias is like modifying a function l ocal variable. Consider using an array of objects and use v-model on an object property instead.

正确写法:

<input v-for="(item,index) in list" :key="index" v-model="list[index]"/>

实例：

  <div class="cu-form-group" v-for="(item,index) in appData.welcomeList" :key="index" >
    <input class='radius' :name="'welcome'+index" v-model="appData.welcomeList[index]"/>
    <button class='cu-btn bg-red shadow-blur sm' @click="deleteWelcome(index)">
      <span class='icon-delete'></span> </button>
  </div>

不要写成

<input v-model="item"> //错的