怎么在mounted里面使用vuex的数据？

• Z时代
• 2024-03-13
• 分类：IT

回答：

如果是vue2.x

// 直接获取
this.$store.state.模块名.feedBackDetails
// 通过 getters
getters: {
    getFeedBackDetails: state => state.feedBackDetails
}
// 通过映射函数mapState 或 mapGetter
computed() {
  ...mapState({
    feedBackDetails: state => state.模块名.feedBackDetails
  })
    // 或者
  ...mapGetter([
    feedBackDetails: 'getFeedBackDetails'
  ])
}
// 直接this.feedBackDetails 调用
mounted() {
    console.log(this.$store.state.模块名.feedBackDetails)
    console.log(this.feedBackDetails)
}

如果是vue3.x

import { onMounted } from 'vue'
import { useStore } from 'vuex'
const store = useStore()
onMounted(() => {
    console.log(store.feedBackDetails)
})

// 补充：获取不到的话需要修改一下action, 返回一个promise。

// store
actions: {
    async updateDetails(context, payload) {
        return new Promise((resolve, reject) => {
            // 请求获取数据，更新feedBackDetails逻辑
            ...
            resolve()
        })
    }
}
// 在vue组件中调用
async mounted() {
    await this.$store.dispatch('updateDetails')
    console.log(this.$store.state.模块名.feedBackDetails) //这样就不会undefined了
}

以上是 怎么在mounted里面使用vuex的数据？ 的全部内容， 来源链接： utcz.com/p/932918.html