美文网首页
vuex模块化布局

vuex模块化布局

作者: 小裴走世界 | 来源:发表于2020-05-30 19:03 被阅读0次

1.login目录下边新建index.js,存储登录模块的状态

Const  state = {   

     Name:’haha'

}

const   getters = {       

   NewName(state,getters,rootState,rootGetters){          

         Return state.name + arg         

    }     

 }

Const    mutations = {          

      Change_name(state,arg) {          

          state.name = arg          

     }        

}

Const    actions = {          

       ChangeName( {commit, getters,rootstate,rootGetters}, arg) {            

                Commit(‘change_name’,arg)          

      }      

};

#index.js Export default {        

Namespaced: true,  #模块局部命名空间      

       State,      

       Mutations,      

      Actions,      

      Getters    

}

2.src目录下新建store.js,这是根store,通过modules属性引入login模块

import Vue from "vue";

import Vuex from "vuex";

Vue.use(Vuex);

// 引入login 模块

import login from "./login"

export default new Vuex.Store({  

 // 通过modules属性引入login 模块。   

modules: {     

       login: login   

    }

})

3.在main.js中引入store, 并注入到vue 根实例中。

import Vue from 'vue'

import App from './App.vue'

// 引入store

import store from "./store"

new Vue({ el: '#app', store,

       // 注入到根实例中。

       render: h => h(App)

})

相关文章

  • vuex模块化布局

    1.login目录下边新建index.js,存储登录模块的状态 Const state = { Name:’h...

  • 模块化vuex,获取、设置数据,及刷新保留数据方法

    前言 1.模块化vuex2.获取vuex中的数据3.设置vuex中的数据4.刷新之后,保留数据 模块化vuex 数...

  • VUEX模块化

    vuex模块化官方文档 项目github地址 在vuex的官网上,关于模块化和热重载的文档都是蛮详细的,这边也就不...

  • vuex相关文章

    vuex模块化和命名空间的实例代码

  • vuex持久化+模块化实战用法(进阶篇)

    上一篇:vuex刷新数据消失不见解决方案 Vuex模块化 模块化后的 store 大概长这样,如果画的不对,欢迎留...

  • vuex入门实例2

    vuex入门实例2 这章节我准备以requirejs模块化,讲解下如何快速上手vuex 源码地址 工程代码结构如下...

  • 2018-03-13

    Vuex 进阶——模块化组织 Vuex 前两篇讲解了一下 Vuex 的基本使用方法,可是在实际项目中那么写肯定是不...

  • vuex模块化

    上一节[https://www.jianshu.com/p/5dd561f3570d] modules modul...

  • vuex模块化

    demo store/modules/user.js 可以通过添加 namespaced: true 的方式使其成...

  • vuex模块化

    App.vue Count.vue Person.vue index.js count.js(只写count相关逻...

网友评论

      本文标题:vuex模块化布局

      本文链接:https://www.haomeiwen.com/subject/uwuhzhtx.html