总结
getters
- 写法
- getters方法是和state同一级别的方法
- getters相当于一个计算属性
const store = new Vuex.Store({
state:{
user:{
name: '',
tel: '',
id: '',
sex: ''
}
},
getters:{
// 写getters的计算属性(函数)
getUserId(state) {
return state.user.id
}
}
})
- 在vue文件中使用
第一种写法
<template>
<div>{{$store.getters.getUserId}}</div>
</template>
created() {
console.log(this.$store.getters.getUserId)
}
第二种写法
<template>
<div>{{getUserId}}</div>
</template>
import { mapGetters } from 'vuex'
export default {
data() {
return {
}
},
computed: {
...mapGetters([
'getUserId'
])
},
created() {
console.log(this.$store.getters.getUserId)
}
}