vue对象、数组响应式更新

1.数组响应式更新示例(含子元素为数组的情况):

秘诀:

1.$set方法第1个参数target不可以使用 obj.obj1或arr[0]这样的级联读取方式,只允许使用顶层对象;

2.子元素需要采用js传统方法(不需要采用vue响应式方法)提前组装好,传给$set方法第3个参数value即可;

  • data
data() {
    return {
      dianweiTree:[
        // {
        //   key:"",
        //   label: "",
        //   children: [{key:"",label: ""},{key:"",label: ""}]
        // }
      ],
    }
}
  • method

methods: {
    test1(){
      let self = this;

      let children11={};
      children11.key="1-1";
      children11.label="1-1";

      let dianwei1={};
      dianwei1.key="1";
      dianwei1.label="1";
      dianwei1.children=[children11];
      self.$set(self.dianweiTree,0,dianwei1);
    },
}

猜你喜欢

转载自blog.csdn.net/mnbwz/article/details/111883159