vue.js - Vue.js v-for 和 v-model

Question

错误：'v-model' 指令无法更新迭代变量 'msg' 本身 vue/valid-v-model

<div v-for="(msg,name) in normal" :key="name">
<input type="text" v-model="msg">
</div>
    <script>
export default{
data(){
normal: {
        position: "bottom",
        message: "",
        open: false,
        timeout: 1500,
      }}}
</script>

标签： vue.js

Answer 1

您需要直接从数据中编辑数组/对象变量。在“for”循环中访问“msg”时，您只会获得项目值的副本，而不是对对象/数组项目的引用。

正确的用法是：

<div v-for="(msg, name) in normal" :key="name">
   <input type="text" v-model="normal[name]">
</div>