VUE3 中使用 VUEX，报错【[Vue warn]: inject() can only be used inside setup() or functional components.】

VUE3 中使用 VUEX，报错【[Vue warn]: inject() can only be used inside setup() or functional components.】

参考链接1：参考链接 vuex 报错 injuce()
参考链接2：vuex 报错 无法在methods中使用store的引入

• 因为在setup中，已经对store进行了定义，所以不能再在外边的methods中进行访问

  • javascript fail

    ···
    import { useStore } from 'vuex';
    ···
    setup () {
       ···
       const store = useStore();
        store.dispatch(`user/${LOGIN}`, { ...values, type: state.customActiveKey === 'tab1' }).then(res => {
            console.log('========校验通过', res);
        })
       ···
    },
    methods: {
       handleTestStore () {
         const store = useStore();
         console.log(store, '=======', useStore); // 这里打印的数据就是上图的undefined
         const p = { info: 'test' };
         useStore.dispatch(`user/${LOGIN}`, p).then(r => {
           console.log('========校验通过', r);
         });
       }
    }
    
    

    

• 如何正确访问store，仅需要在methods中使用 this.$store，即可替代原先methods中的userStore，正确拿到store

  • ···
    methods: {
        handleTestStore () {
          console.log(this.$store)
          const p = { info: 'test' };
          this.$store.dispatch(`user/${LOGIN}`, p).then(r => {
            console.log('========校验通过', r);
          });
        }
    }
    ···