Vuex的安装和基本使用

一、vuex的安装

分为两种情况：

1. 项目初始搭建时：

用vue-cli3以上的脚手架搭建项目时可以选择安装vuex模块，脚手架会帮我们配置好最初的一个vuex功能； 用vue-cli2的脚手架搭建项目时，则无法让脚手架帮我们自动安装vuex的功能，需要在项目搭建完毕后，使用命令安装模块并手动配置相关功能(如下配置)；

2. 项目搭建完毕后：

① 使用 npm install vuex --save 命令来安装vuex模块； 在 src 目录下新建
store文件夹，store文件夹下新建 index.js文件；
② index.js文件中导入 vue 和 vuex 模块； 使用Vue.use(vuex) 来安装插件； 创建 Vuex.store() 实例，配置相关属性，并使用 export default导出，以便在main.js文件中导入并注册到vue的实例中，以便在整个项目中可以使用；

index.js文件中代码如下：

// 导入 vue 和 vuex 模块
import Vue from 'vue' 
import Vuex from 'vuex'

// 使用Vue.use(Vuex)来安装vuex插件
Vue.use(Vuex)

// 创建Vuex.Store()实例，配置相关属性
export default new Vuex.Store({   
	state: {   },   
	mutations: {   },   
	actions: {   },   
	modules: {   } 
})

二、使用

在组件中可以使用 this.$store.state.变量名 来访问vuex中的数据