您好,登錄后才能下訂單哦!
這篇文章主要介紹“vuex核心是什么”的相關知識,小編通過實際案例向大家展示操作過程,操作方法簡單快捷,實用性強,希望這篇“vuex核心是什么”文章能幫助大家解決問題。
vuex是專門幫助vue管理的一個js庫,利用了vue.js中細粒度數據響應機制來進行高效的狀態更新。
vuex核心就是store,store就是個倉庫,這里采用了單一的store狀態樹,一個對象就包含了全部的應用層級狀態,這也就使得每個應用僅僅包含一個store實例,這種單一狀態樹可以讓我們直接定位任意的代碼片段,在調試過程中就可以輕松的取得當前應用的快照。
const store = new Vuex.Store({
state: {
count: 0
},
mutations: {
increment(state) {
state.count++
}
},
actions: {
asyncIncrement({ commit }) {
setTimeout(() => commit('increment'), 100);
}
}
})
state為vuex中唯一的數據源,和vue中state的規則一致,都是響應式的,正因為如此,vue component 可以通過 computed屬性來返回在vuex中讀取的值,從而響應式的跟隨state的變化進行渲染 ,除此之外我們還需要從store中的state派生一些狀態,比如過濾篩選數據,vuex允許我們在store定義getter,可以認為是store的一個計算屬性,所以getter中的返回值會根據他的依賴被緩存起來,只有等它的依賴發生變化時,才會被重新計算,這些都是vuex讀取操作。
那么vuex中是如何修改狀態的呢?
更改vuex狀態的唯一方法是mutation,vuex中的mutation 非常類似于事件,每個mutation都有一個字符串的事件類型,和一個回調函數,我們可以通過store的commit方法同步修改store的數據,這里需要注意的是mutation必須是一個同步函數,正因為mutation是同步的,我們可以在vuex中提供的插件機制去訂閱mutation變化,在這些plugins中我們可以進行打點或者做數據監聽相關的工作。
那么vuex中如何完成異步操作呢?
vuex是讓action來完成異步操作,我們可以通過store的dispatch方法來觸發相應的action的操作,然后在action中完成類似接口獲取或者異步操作,在異步操作完成后的回調函數中使用commit觸發mutation變更state中的數據。
關于“vuex核心是什么”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識,可以關注億速云行業資訊頻道,小編每天都會為大家更新不同的知識點。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。