爲什麼有可能有在安裝中添加活性元素？

的文檔Reactivity in Depth解釋了爲什麼增加新的根級別的反應特性，以一個已經創建的實例是不可能的（以及如何實際上是通過this.$set()添加的話）。爲什麼有可能有在安裝中添加活性元素？

在這種情況下，爲什麼初始爲空的對象可以在安裝時被更新（和反應性），則該實例後intialized？或者不初始化部分包括安裝？（雖然它可能mount an instance manually的initalization後）安裝後

new Vue({ 
 
    el: "#app", 
 
    data: { 
 
    myobject: {} 
 
    }, 
 
    mounted() { 
 
    setTimeout(() => { 
 
     this.myobject = { 
 
     "x": 1 
 
     } 
 
    }, 2000) 
 
    } 
 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.11/vue.js"></script> 
 
<div id="app"> 
 
    {{myobject}} 
 
</div>

直接進一步的修改不與文檔（this.myobject.y = 2例如是行不通的，同時考慮到，在線路this.$set(this.myobject, "y", 2)將被罰款）

來源

2017-12-18 WoJ

您的示例中的代碼不屬於更改檢測警告，因爲您沒有將屬性添加到myobject您正在設置myobject到完全新的對象。 Vue沒有問題檢測對象引用的變化。

什麼Vue公司無法檢測是增加一個屬性是不存在的對象。例如，如果你這樣做：

mounted() { 
    setTimeout(() => { 
    this.myobject.someNewProperty = "some value" 
    }, 2000) 
}

Vue不會檢測到變化。以下是您的示例更新，以演示在對象更改後DOM永遠不會更改。

new Vue({ 
 
    el: "#app", 
 
    data: { 
 
    myobject: {} 
 
    }, 
 
    mounted() { 
 
    setTimeout(() => { 
 
     this.myobject.someNewProperty = "some value" 
 
    }, 2000) 
 
    } 
 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.11/vue.js"></script> 
 
<div id="app"> 
 
    {{myobject}} 
 
</div>

當它說

Vue公司不會動態允許添加新的根級反應屬性已創建的實例什麼文件指。

是否在創建Vue實例後無法將其他屬性添加到數據對象。例如，這代碼：

var vm = new Vue({ 
 
    el: "#app", 
 
    data: { 
 
    myobject: {} 
 
    }, 
 
    mounted() { 
 
    setTimeout(() => { 
 
     this.$set(vm.$data, 'newRootLevelProperty', "some value") 
 
    }, 2000) 
 
    } 
 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.11/vue.js"></script> 
 
<div id="app"> 
 
    {{myobject}} 
 
</div>

結果在警告

[Vue的警告]：避免添加反應性特性在運行時的Vue實例或其根$數據 - 在數據選項中聲明它。

但是你可以向嵌套對象（如myobject）只要您使用$設置添加屬性。

來源

2017-12-18 14:31:05 Bert

爲什麼有可能有在安裝中添加活性元素？

回答

相關問題