Vue.js 使用VUE数组生成动态数据变量

我试图为

VUE

定义动态变量，然后在

v-for

中使用它们。当我加载页面时，它们可以工作，但是如果它们稍后更改其值，视图中的值将不再更改

VUE

const-app=新的Vue({
el:“#主要创建”，
数据：{
模块：[]，
特色：[]
},
});

我正在使用此函数生成

功能中的变量

：

函数createDataFeatures（）{
$。每个（app.modules，函数（索引，模块）{
app.feature[索引]=module.features；
});
}

所以我在视图中加载它：

@{{feat.title}
@{{feat.price？'$'+feat.price:'$0'}

---

加载页面时，我正确加载了数据，但如果我随后更改了ejm值：

功能[index]=[other array]

（我将其更改为与开始时相同的数据格式）视图中的值不会更改任何内容。一个解决方案或替代方案会很好。

行

app.feature[index]=module.features在阵列方面受到Vue的限制

要修复，请使用：

$。每个（应用程序模块、函数（索引、模块）{
Vue.set（app.feature、index、module.features）；//更改了此行
});

见：

由于JavaScript的限制，Vue无法检测以下内容
对数组的更改：

直接使用索引设置项目时，例如
vm.items[indexOfItem]=newValue
修改数组长度时，例如
vm.items.length=newLength
为了克服警告1，以下两项将实现相同的效果
as
vm.items[indexOfItem]=newValue
，但也将触发状态
反应系统的更新：

// Vue.set
Vue.set(vm.items, indexOfItem, newValue)