Javascript Vue.js正在更新数组的内容
我有一个数组Javascript Vue.js正在更新数组的内容,javascript,vue.js,vuejs2,Javascript,Vue.js,Vuejs2,我有一个数组feedListBox,分配给我的feeds数据对象。当我更新feedListBox数组时,Vue.js没有检测到它。因此,我在script.js文件myApp.fixFeedArray()中使用fixFeedArray方法。它工作得非常好,但我想知道是否有其他方法可以不使用脚本文件中的任何函数来完成它。我是说自动的 var myApp = new Vue({ el: '#my-App', data: { feeds: feedListBox,
feedListBox
,分配给我的feeds数据对象。当我更新feedListBox数组时,Vue.js没有检测到它。因此,我在script.js文件myApp.fixFeedArray()
中使用fixFeedArray
方法。它工作得非常好,但我想知道是否有其他方法可以不使用脚本文件中的任何函数来完成它。我是说自动的
var myApp = new Vue({
el: '#my-App',
data: {
feeds: feedListBox,
},
methods: {
fixFeedArray: function fixFeedArray() {
this.feeds = feedListBox;
}
}
});
下面是更改脚本文件中feedListBox数组值的函数
function searchByCategory() {
var category = $("#categoryBox").val();
var searchedCategories = feedArray.filter(function (item) {
return item.category.includes(category);
});
feedListBox = searchedCategories;
myApp.fixFeedArray();
}
首先,我个人会抛弃jQuery。下面是一个快速示例,说明如何将新数据推送到数组中,以便Vue对其作出反应并重新渲染。如果它不是一个实用函数,我建议将所有操作数据的函数都保留在methods对象中
newvue({
el:“主要”,
数据:{
错误:null,
新文本:“”,
新值:“”,
类别:[{
文字:“形状”,
值:“形状”
},
{
文字:“颜色”,
值:“颜色”
},
{
文字:“尺寸”,
值:“大小”
},
],
},
方法:{
测试:函数(){
如果(this.newText==“”||
this.newValue===“”){
返回此值。错误='请填写表单!'
}
这是推({
text:this.newText,
value:this.newValue,
});
返回此。清除();
},
清除:函数(){
this.newText='';
this.newValue='';
this.error='';
}
}
});代码>
{{error}}
-
{{item.text}
正文
价值
添加到数组
你能在feedListBox
更改其值的地方做一个演示吗?@user2486我添加了更改feedListBox arry值的功能。为什么searchByCategory
不在vue中?如果没有具体原因,应该在vue中。你们可以使用计算方法。首先尝试一下,如果你不能,我将按我的建议发布是,并在那里设置提要