10-1 拆分 Vuex

1. 若架構變大時，可以將 Vuex 項目都獨立出來

   import { createStore } from "vuex";
   import state from "./state.js";
   import actions from "./actions.js";
   import mutations from "./mutations.js";
   import getters from "./getters.js";
   import Auth from "./Auth";
   export default createStore({
     state,
     actions,
     mutations,
     getters,
     modules: {
       Auth,
     },
   });
   

    

2. \src\store\state.js

   export default {
     isOpen: false,
   };
   

    

3. \src\store\actions.js

   export default {
     handOpenState(context) {
       const isOpen = !context.state.isOpen;
       context.commit("OpenState", isOpen);
     },
   };
   

    

4. \src\store\mutations.js

   export default {
     OpenState(state, payload) {
       state.isOpen = payload;
     },
   };
   

    

5. \src\store\getters.js

   export default {
     isOpen(state) {
       return state.isOpen;
     },
   };
   

    

6.