小程序 · 报错：: You are binding v-model directly...

时间 2019-11-16

标签程序报错 binding model directly 繁體版

原文原文链接

报错来源：

input使用for循环：bash

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

实例：ide

<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.spa

正确写法:

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

实例：code

<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>
复制代码

不要写成orm

<input v-model="item"> //错的
复制代码