这是一个创建于 1871 天前的主题，其中的信息可能已经有所发展或是发生改变。
vue 文档上说由于 es5 的限制不能数组的变化但是对数组的方法做了包裹 比如 splice
https://jsfiddle.net/4kg25ovt/2/
今天用了一下，发现在项目中使用 splice()不能更新视图了，必须再来个 this.$forceUpdate()， 代码如下，
this.pagaData.questionDetails.splice(index, 1)
和绑定的 key 相关吗？有没有大佬给点意见和看法
 |
1
duzhihao OP 这是一个双循环的数组
```html <div v-for="(value, index) in pagaData.questionDetails" :key="index" class="mb15" > <div class="mb10"> <div v-for="item in columnDetails.otherOption" :key="item.label" class="flex wrap mb10"> <span class="label">{{item.label}}：</span> <div v-html="value[item.prop]"></div> </div> <div class="flex wrap mb10" v-for="v in value.details" :key="v[columnDetails.details.name]"> <span class="label">{{v[columnDetails.details.name]}}：</span> <div v-html="v[columnDetails.details.content]"></div> </div> </div> <el-button size="mini" @click="editOption(index)">编辑</el-button> <el-button size="mini" @click="deleteOption(index)">删除</el-button> </div> ``` ```js deleteOption (index) { this.pagaData.questionDetails.splice(index, 1) // this.$forceUpdate() } ``` |
|
2
duzhihao OP 这个问题解决了，还是文档上那句话
> 如果你发现你自己需要在 Vue 中做一次强制更新，99.9% 的情况，是你在某个地方做错了事 原来是 this.pageDate.questionDetailss 是直接赋值的。所有他的更新不会影响视图（ push 竟然可以） |
 |
3
riemannhas 2019-10-12 17:25:15 +08:00
数据更新建议通过 vuex 状态管理来处理 而不是直接操作
|
Select Language