建站优化

当前位置:

vue.set用法

浏览量:94次

vue.set用法

vue.set()用法是什么呢?不知道的小伙伴来看看阳泰小编今天的分享吧!

1、vue.set()基本方法介绍

使用vue的set()方法可以实现改变数据并立刻将新数据渲染在网页上的目的(响应式)。该方法可以应用于数组和对象类型

Vue.set(vm.items, indexOfItem, newValue)1
  • vm.items :代表源数据

  • indexOfItem : 代表要修改的数据的键

  • newValue : 代表要修改的数据的新值

2、使用方式

// 方式一Vue.set(源数据,要修改的键,新值)// 方式二:使用this或vm的Vue实例对象vm.$set(源数据,要修改的键,新值)

举例

修改李四的 age 为 19 ,如果直接修改,vue是获取不到的,需要借助 $set 来手动触发改变

1)源数据:

let a = [    {name:'张三',age:'20',sex:1},    {name:'李四',age:'21',sex:0},    {name:'王五',age:'22',sex:1},]12345

2)要修改的数据的键:

//a数组的下标112

3)要修改的数据的新值(修改后的数据):

a[1].age = 191

4)使用set:

Vue.set(a,1,a[1]) //修改了对象的属性值Vue.forceUpdate() //也可以用这个方法手动触发视图更改

[声明]本网转载网络媒体稿件是为了传播更多的信息,此类稿件不代表本网观点,本网不承担此类稿件侵权行为的连带责任。故此,如果您发现本网站的内容侵犯了您的版权,请您的相关内容发至此邮箱【779898168@qq.com】,我们在确认后,会立即删除,保证您的版权。