Vuex的五个核心属性及辅助函数

vuex是什么?
vuex是一个专门为vue.js应用程序开发的状态管理模式,它采用了集中式存储和管理程序所有组件的状态
主要包括几个模块
state 存储所有的变量(state是一个对象)
mutations 直接操作state中的数据
actions 只能调用mutations中的方法
getters 类似于计算属性,可以实现对state做一些逻辑性的操作
modules 将仓库模块化存储

辅助函数
mapState
引入
import {mapState} from “vuex”
3种方法:
1.对象
computed:mapState({
//箭头函数
count:state=>state.count,
// 这里为了能够使用this获取局部变量localCount,必须使用常规函数
countPlusLocalState (state) {
return state.count + this.localCount
}
})
2.数组
computed: mapState([
// 映射 this.count 为 store.state.count
‘count’
])
3.对象展开运算符
computed: {
localComputed () {},
…mapState({})
}
mapGetters:mapGetters将store中的getter映射到局部计算属性
computed: {
…mapGetters([
‘oneGetter’,
‘anotherGetter’
])
}

mapMutations
使用mapMutations辅助函数将组件中的methods映射为store.commit调用。
methods: {
// 通过 this.KaTeX parse error: Expected 'EOF', got '}' at position 50: …ions(['tips']) }̲ mapAction meth…store.dispatch(‘tips’)传
…mapActions([‘tips’])
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值