官方文档
vuex 是什么
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.
为什么要使用vuex
vux 可以解决多个组件之间的通信问题
vuex 基本了解
- 容器(store): 用于存储状态的
- 状态(state): 多个组件需要共享的数据(就可以称之为状态)
- 突变(mutations): 由于单向数据流的关系,如果组件需要修改容器中的状态,就必须通过
mutations可以将这个mutation理解为一个状态管理员, 组件想要修改状态就必须告诉管理员, 由管理员来决定是否更改数据,需改数据的规则, 如下图所示
vuex
此处的状态可以简单的理解为 需要被多个组件共享的数据
getter
有时候我们需要根据store中的state的数据进行过滤加工,就需要使用 getter, 例如对数组进行过滤,然后产生一个新的数组展示到页面中, 比如脏话(字符串)过滤.... 我们可以将vux中的 getter 理解为 vue实例的计算属性
基本使用
vuex study 现在的状态: {
{$store.state.counter}}
其他组件中的状态: {
{$store.state.counter}}在其他组件中使用getter属性: {
{$store.getters.computeCounter}}