目錄
npm install[email protected] install: `node install.js`npm install --ignore-scripts
npm run dev
專案其實非常簡單，就是點選加號數字可以新增，然後可以檢測到數字是奇數還是偶數。後面兩個按鈕，分筆是如果是奇數的加1，另外一個是非同步增加數字。
在開始閱讀**之前，不妨大膽的揣測下實現的思路。然後再對照**，學習改進。
該demo是關於vuex的**。那麼實現不用說一定是vuex來實現的。那麼專案實現的大概思路應該是使用一個 vuex的state來記錄count,然後再mutations中可以實現一個increment方法和decrement 方法。點選按鈕的時候就可以增加或者減少count的值。然後需要一個可以實時監測著count 是技術還是偶數的操作，這個可以用getters來實現。至於後面的兩個按鈕。第一個可以在mutations中寫一個方法來判斷並且新增，也可以在actions中增加方法來實現。最後一個按鈕是非同步的，只能在actions中去實現。根據專案結構，我們應該不難揣測出來vuex的**記錄在store.js中。counter.vue實現了介面對vuex的資料呼叫。
// store.js
import vue from 'vue'
import vuex from 'vuex'
vue.use(vuex)
const state =
const mutations = ,
decrement (state)
}const actions = ) => commit('increment'),
decrement: () => commit('decrement'),
incrementifodd ()
},incrementasync () , 1000)
})}}
const getters =
export default new vuex.store()
需要注意的：
如果把vuex得**寫在分開的類中，然後被其他類引入，我們需要用export default的語法來實現。
例子中的**在actions中有把mutations中的進行了封裝。
+-increment if odd
increment async
在counter.vue中實現的對vuex的呼叫。我們可以學習到如何簡單的把actions引入到呼叫的元件中來。mapgetters和mapactions的使用。
如果把vuex得**寫在分開的類中，然後被其他類引入，我們需要用export default的語法來實現。
例子中的**在actions中有把mutations中的進行了封裝。
mapgetters和mapactions的使用。
demo非常簡單。入門第一個。