原创 https://segmentfault.com/q/1010000012375354/a-1020000012377603

vue 中 如何修改【数组中】【对象的值】

在这里插入图片描述

通过数组的变异方法(Vue数组变异方法)我们可以动态控制数据的增减,但是我们却无法做到对某一条数据的修改。这时候就需要Vue的内置方法来帮忙了~

vue 中是无法检测到根据索引值修改的数据变动的
但 你可以这样做

// 第一个参数是要修改的数据, 第二个值是修改当前数组的哪一个字段,第三个是要修改为什么值
// 要修改的数据: 根据索引值你可以拿到数组中的第 `index`条数据: `this.iptDatas[index]`
// 前数组的哪一个字段: `showAlert`
// 修改为 `true`

this.$set(this.iptDatas[index], `showAlert`, true)
或者
Vue.set(this.iptDatas[index], `showAlert`, true)

Vue.set() 响应式新增与修改数据

此时我们需要知道Vue.set()需要哪些参数,官方API:Vue.set()

调用方法:Vue.set( target, key, value )

target:要更改的数据源(可以是对象或者数组)
key:要更改的具体数据
value :重新赋的值

this.iptDatas[index].showAlert = true;
Vue.set(this.iptDatas, index, this.iptDatas[index]);

注意: 要用ES6语法 ``

亲测有用

Logo

前往低代码交流专区

更多推荐