javascript - Vue 组件传递多个对象作为 Prop 不起作用

标签 javascript vue.js vuejs2

我正在尝试通过 v-for 将多个 props 传递给一个组件 --

<my-component v-for="(myobj, myid) in mydata"></my-component>

我的数据看起来像 --

mydata: {
  42: { txt: "Home", url: "https://google.com/" },
  43: { txt: "SO", url: "https://stackoverflow.com/" }
}

但无法让最简单的代码段起作用 --

https://codepen.io/jerryji/pen/yGOrbj?editors=1011

任何指针将不胜感激!

最佳答案

您的 v-for 循环没有将任何数据绑定(bind)到组件。不见了v-bind directives为您的绑定(bind)。它应该看起来像这样:

<my-component v-for="(myobj, myid) in mydata"
             :myobj="myobj"
             :myid="myid"></my-component>

demo

关于javascript - Vue 组件传递多个对象作为 Prop 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53799837/

相关文章:

c# - 排序不适用于给出编码输出的 Json 结果

watch - 如何在 Vue 2 中查看数据对象中的所有键

javascript - 在 vuetify 中将覆盖层放在 fab 按钮上

javascript - 重置过滤数据 Vue.js

vue.js - Vuejs : how to mix static and dynamic content in template?

javascript - 使用 jQuery 错误编译 coffeescript

javascript - 恢复插件JS

Vue.js v-for 与 v-model

html - 为什么在调整浏览器窗口大小时 h1 元素中的内容一直重叠?

javascript - 将事件监听器添加到 Windows Phone 上的按钮 "Back, Start, Search"