Question

所以我有一些帖子的对象，我正在使用v-for在自定义组件中迭代它们，但是如何将数据从这个对象传递给这个组件，循环是一个显示数据的东西另一个.. 。

<app-single-post v-for="post in posts" postData="$post"></app-single-post>

这是我的组件声明。我是否还需要某种特殊的道具设置？一次又一次地出现同样的错误：

Property or method "postData" is not defined

Answer 1

使用binding syntax。

<app-single-post v-for="post in posts" :post="post" :key="post.id"></app-single-post>

当Camel-cased属性用作属性时，需要将其转换为kebab-case。另外，我添加了key。使用key时应始终使用v-for，并且在迭代自定义组件时需要使用post.id。理想情况下，如果有export default { props:["post"], methods: {...}, etc. }，您可能希望使用{{post.id}}。

在您的组件中，您应该具有如下定义的属性：

this.post

要在组件模板中引用帖子，您可以使用

{{1}}

和内部方法将是

{{1}}

将数据对象从Vue for循环传递给组件

1 个答案: