vue3.0---使用computed来获取vuex里数据
不再是vue2.0里什么mapGetter,mapState那些复杂的获取方式,vue3.0里直接使用computed就可以调用vuex里的数据了。喜大普奔。同时注意,一点,不可以直接使用useStore()方法里的state对象,因为在输出useStore方法的数据中,state是浅灰色的。浅灰色只可看到,但是不可以直接使用。如图:<template><div>{{dat
·
不再是vue2.0里什么mapGetter,mapState那些复杂的获取方式,
vue3.0里直接使用computed就可以调用vuex里的数据了。喜大普奔。
同时注意,一点,不可以直接使用useStore()方法里的state对象,因为在输出useStore方法的数据中,state是浅灰色的。浅灰色只可看到,但是不可以直接使用。如图:
<template>
<div>{{dataList}}</div>
</template>
<script>
import { defineComponent, ref, reactive, toRefs, computed } from "vue";
import { useStore } from 'vuex'
// computed 计算属性
export default defineComponent({
name: "home",
setup(props, ctx) {
let store = useStore()
// 因为store里state是浅灰色的,所以不能直接使用,若要使用store.state.dataList需要computed来调用
console.log(store)
let dataList = computed(()=>{
return store.state.dataList
})
console.log(dataList)
return {
store,
dataList
}
},
});
</script>
<style scoped lang="scss">
</style>
更多推荐
已为社区贡献5条内容
所有评论(0)