我想將資料從嵌套組件更新到根實體。我知道使用$emit可以將資料更新到父組件。但是如果組件從根開始在許多層中是沒有效率的。
我看了看，Vuex似乎很好地解決了這種情況。但我想知道為什么不直接設定this.$root.value = newValue如下：
// Root
new Vue({
data: {
value: ''
}
})
// Nested Child
<template>
<input type="text" @input="onInput" />
</template>
<script>
export default {
methods: {
onInput: function(event){
this.$root.value = event.target.value;
},
}
}
</script>
我想知道這兩者有什么不同。謝謝。
uj5u.com熱心網友回復：
我認為您絕對可以依賴根狀態本身，但狀態管理庫有助于以多種方式組織您的代碼。
由于使用單個狀態樹，您的應用程式的所有狀態都包含在一個大物件中。
隨著您的應用程式變得越來越大，這個狀態樹變得非常難以處理。
例如，如果您有一個跨多個組件共享的事實來源，如下所示：
var sourceOfTruth = {}
var vmA = new Vue({
data: sourceOfTruth
})
var vmB = new Vue({
data: sourceOfTruth
})
完美運行，但是兩個組件都可以改變這個狀態，所以如果狀態在某個地方變臟，那么祝你好運除錯什么和哪里出錯了。我們應用程式的任何部分都可以隨時更改任何資料，而不會留下任何痕跡。
這本身就是使用狀態管理庫的一個很好的理由，但 vuex 也提供了其他有用的工具。
僅舉幾例：Vuex 允許您將商店劃分為模塊。每個模塊都可以包含自己的狀態、突變、動作、getter，甚至嵌套模塊。如果您希望您的模塊更加獨立或可重用，您也可以使用命名空間對其進行標記。
我希望我能為你澄清一點。國家管理震撼！
有關詳細資訊，請查看檔案：
https://v2.vuejs.org/v2/guide/state-management.html
https://vuex.vuejs.org/guide/modules.html
uj5u.com熱心網友回復：
VueX（或輕量級替代品 Pinia）充當強大的狀態管理存盤，不僅允許您從應用程式中的任何位置（如資料庫）訪問資料，而且還可以將額外的邏輯系結到處理或鏈接其他操作到您的資料更新。
您還可以將您的 VueX 存盤組織到多個檔案中，以保持您的代碼庫井井有條并準備好擴展，這意味著任何加入該專案的人都知道在哪里可以找到全域可訪問的資料。
希望這有助于您做出決定。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/432656.html
下一篇：如何在計算屬性中獲取插槽道具？