【问题标题】:Vue.js v-for with v-modelVue.js v-for 和 v-model
【发布时间】:2020-07-18 21:52:12
【问题描述】:

错误:'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>

【问题讨论】:

  • data 不是date

标签: vue.js


【解决方案1】:

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

正确的用法是:

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

【讨论】:

  • 根据您的代码,应该有 4 个输入。在 normal.message 中输入一些内容。输入还是空的?你需要为此提供一些小提琴。
  • 请在您的答案中添加一些解释,以便其他人学习
  • 哎呀,这是我的错,我输入v-model="normal['name']"然后出错
【解决方案2】:

试试这样的:

   <v-checkbox
        v-for="(value, key, index) in activeDays"
        v-model="activeDays[key]"
        :key="index"
        :label="`${key}`"
        ></v-checkbox>
    
    
    
activeDays: {monday:false, tuesday:false}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-07-04
    • 1970-01-01
    • 2019-05-07
    • 1970-01-01
    • 2022-09-30
    • 2019-04-30
    • 1970-01-01
    • 2023-04-08
    相关资源
    最近更新 更多