Vue入门 Vuex状态管理模式--2
Vue入门 Vuex状态管理模式–2
官网地址: https://vuex.vuejs.org/zh/installation.html
一、安装Vuex
二、Vuex的用法
1. state：状态。
2. getters：获取数据,state的计算属性。
3. mutations：修改状态，同步操作，非常类似于事件。
4. actions：异步操作。
5. modules：官网上讲述到Vuex 允许我们将 store 分割成模块（module）。每个模块拥有自己的 state、getter、mutation、action，甚至是嵌套子模块。
三、用一个更简单的方式来使用vuex
1. mapState
2. mapMutations
3. mapActions
4. mapGetters
一、安装Vuex
在Vue项目下输入npm install vuex --save，如下图所示:
二、Vuex的用法
- 创建vuex包下的store.js文件，代码如下：
- 在main.js中引入store，代码如下：
- 在HelloWorld.vue中删除不用的代码并获取状态值，代码如下：
效果图如下：
getters
- 代码如下：
从页面获取的代码如下：
效果图如下：
mutations
- 代码如下：
效果图如下：
actions
- 代码如下：
效果图如下：
###### modules
4.代码如下：