iT邦幫忙

0

Vuex 是什麼

VuexVue 提供的一種資料狀態管理的模式,它可以統一控管資料的狀態,都是在小型的 SPA 網站,元件資料的傳遞可以透過 props ,但如果是大型的 SPA 專案,則建議可以使用 Vuex 來統一管理資料的狀態。

這裡會以 Vue Cli 的專案為範例,可以直接在終端下 npm install vuex --save 來安裝 Vuex
接著會在 main.js 裡面 import 且使用 use 的方式來啟用

import Vuex from 'vuex'

Vue.use(Vuex);

接著會在 src 資料夾建立一個 store 資料夾控管資料狀態的檔案,此時可以新增一個 index.jsstore 內,之後也是要 import 跟啟用

// 這裡別忘記也要載入 Vue
import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex);

接著把這支 index.jsexport 的方式匯出

export default new Vuex.store({});

之後 import 匯入到 main.js

import store from './store';

然後放入到 main.js 的 Vue 實體內

new Vue({
    store
});

這樣 Vuex 的準備就算是完成了 ~


尚未有邦友留言

立即登入留言