首页 > 解决方案 > 如何在 vue.js 组件中动态添加属性

问题描述

我正在使用 NYT REST API 制作新闻网站。我想使用document.getElementsByClassName()为组件动态添加属性

例如,我想为我的组件添加一个标题(标题实际上是一个字符串类型的道具),我想使用循环动态添加它。我已经在给定的代码片段中正常添加了它,但是如果我有 30 个组件并且我有一个数组中的数据并且我想从该数组中给出标题怎么办。

<News_Card class="card" :title='this.all_data[0].title' />

我希望使用循环添加这个:title='this.all_data[0].title

标签: javascriptarraysvue.jsweb

解决方案


您可以使用v-for指令来呈现all_data项目:

<News_Card class="card" v-for="(item,index) in all_data" 
                    :title='item.title' :key="index" />

推荐阅读