vue.js遇到的问题-数组数据改变,页面不能实时显示
对于这种表单,有删除,上移,下移等操作在上移下移时会遇到一个问题,见官方文档由于 JavaScript 的限制,Vue 不能检测以下变动的数组:当你利用索引直接设置一个项时,例如:vm.items[indexOfItem] = newValue当你修改数组的长度时,例如:vm.items.length = newLength因此,我的移动操作代码是,以下移为例...
·
对于这种表单,有删除,上移,下移等操作
在上移下移时会遇到一个问题,见官方文档
由于 JavaScript 的限制,Vue 不能检测以下变动的数组:
- 当你利用索引直接设置一个项时,例如:
vm.items[indexOfItem] = newValue
- 当你修改数组的长度时,例如:
vm.items.length = newLength
因此,我的移动操作代码是,以下移为例
// 向下移动 resultStepsList是列表数据
downStepsIndex:function(item,index){
var smallItem = this.resultStepsList[index];
var largeItem = this.resultStepsList[index+1];
this.resultStepsList.$set(index,largeItem);
this.resultStepsList.$set(index+1,smallItem);
},
利用索引直接设置一个项,Vue 不能检测以下变动的数组。导致页面不能实时显示我上移和下移后的结果
用“vm.$set
实例方法”就能解决这个问题
高版本的用法:
this.$set(this.resultStepsList,index,largeItem);
this.$set(this.resultStepsList,index+1,smallItem);
更多推荐
已为社区贡献15条内容
所有评论(0)