从Vue-Typescript导入状态（由javascript开发）

Question

My project was developed by Vue js and it has store developed by javascript, and I integrated new component which is developed by vue-typescript and all scripts in this components are developed by typescript.

To import state variable, I tried two ways

use Vuex

import { mapGetters, mapState, mapActions, mapMutations, createNamespacedHelpers } from 'vuex'

@Component({
  computed: {
    ...mapState([
      'allowedUrls'
    ])
  }
})

this case this.allowedUrls is not defined error

Use Vuex-Class

import { State } from 'vuex-class'
@State allowedUrls: string[]

this case, this.allowedUrls is always undefined

How can I fix this problem?

Answer 1

Not entirely sure what is wrong with your code but I do the same thing in a slightly different way and it works:

import { mapState } from 'vuex';
import RootState from '@/store/rootState';

@Component({
  computed: mapState({
    userFullName: (state: RootState) => state.user.fullName,
    userEmail: (state: RootState) => state.user.email
  })
})

RooState is my class for the vuex state. I'm using vue 2.5.17 and vuex 3.0.1.