vuex
vuex的核心是一个抽离出来的全局仓库(store),这个仓库用来维护一些需要在多个组件中使用的数据
vuex中的核心概念
https://vuex.vuejs.org/zh/guide/
安装、使用 vuex
首先我们在 vue.js 2.0 开发环境中安装 vuex :
npm install vuex --save
然后在src目录新建store文件夹
store
--|modules
----|note.js
----|auth.js
--|index.js
在index.js中写入
import Vue from 'vue'
import Vuex from 'vuex'
import note from './modules/note'
Vue.use(Vuex)
export default new Vuex.Store({
modules: {
note, // 新建的模块在这里引入
}
})
在 main.js 中新加 :
import Vue from 'vue'
import App from './App'
import router from './router.js'
import iView from 'iview';
import iEditor from 'iview-editor';
import store from './store' // 这个是新加的
import './style/index.less';
const Bus = new Vue()
Vue.use(iView);
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
el: '#app',
router,
store, // 这个是新加的
components: { App },
template: '<App/>'
})
modules
这里我们为了便于日后的维护 , 我们使用了vuex的模块写法, 我们在 src 目录下 , 新建一个 store 文件夹 , 然后在里面新建了一个 index.js ,然后将每一个模块划分为一个对应的状态文件 , 然后将他们加入 store 文件夹下的 index.js 文件中的 modules 中。
modules: {
note
other: other,//其他组件
}