vue中 给对象添加属性并赋值

vue中对象的添加属性并赋值

如果在vue中给dataform={}中增加age属性并进行赋值

使用this.dataform.age='18',

会报this.dataform.age undefined

原因:

受现代 JavaScript 的限制 (以及废弃 Object.observe),Vue 不能检测到对象属性的添加或删除。由于 Vue 会在初始化实例时对属性执行 getter/setter 转化过程,所以属性必须在 data 对象上存在才能让 Vue 转换它,这样才能让它是响应的。

所以在vue实例创建之后添加的属性不是响应式的

三种解决办法

  1. Vue.set(object,key,value)

  2. this.$set(object,key,value)

  3. 利用Object.assign({},this.obj)

    三种解决办法
    
     //Vue.set(object,key,value)
    
     //this.$set(object,key,value)
    
     //利用Object.assign({},this.obj)
    
       let obj = {
        age:18
        }
    
     this.obj.name = '张三'
    
     Object.assign({},this.obj)
posted @ 2023-02-09 18:03  张尊娟  阅读(1686)  评论(0编辑  收藏  举报