【问题标题】:Vue: v-model in nested v-for-loopVue:嵌套 v-for-loop 中的 v-model
【发布时间】:2018-06-13 07:45:17
【问题描述】:

我被嵌套的 for 循环和其中的 v-model 困住了。我在第一个 for 循环 (row.amount) 中更新数据没有问题,但是当我在一行中更改 John 的输入 member.share 时,John 的所有份额都会更新?

我的组件:

<div v-for="row in rows">
   …
   <input type="text" v-model="row.amount" />
   <div v-for="member in row.teams">
      <input type="text" v-model="member.share" />
   </div>
</div>

这是数据:

rows: [
{
    amount: 100,
    team: [
        {
            name: John,
            share: 0
        },
        {
            name: Jane,
            share: 0
        }
    ] 
},
{
    amount: 299,
    team: [
        {
            name: John,
            share: 0
        },
        {
            name: Jane,
            share: 0
        }
    ] 
}
]

【问题讨论】:

  • 我无法复制您的问题。 codepen.io/Kradek/pen/zpdzqK?editors=1010
  • 这很奇怪。组件中的数据和 vue-app 本身的数据有区别吗?这是我能看到的唯一区别
  • 组件中的数据应该是返回数据对象的函数,否则不是。我更新了笔来演示。
  • 是的,我就是这样

标签: vue.js vue-component v-for v-model


【解决方案1】:

可能跟笔误有关:

您正在循环访问 member in row.teams,但提供的 json 中没有 s。尝试将循环替换为 member in row.team

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2020-05-27
    • 1970-01-01
    • 2019-04-30
    • 1970-01-01
    • 2020-07-18
    • 2020-12-12
    • 2020-07-01
    相关资源
    最近更新 更多