如何在不使用类样式或装饰器语法的情况下获得mapGetters，mapActions Vuex和Typescript的智能感知

Question

我使用Vue.js和Vuex已有一段时间，但始终使用javascript。

我正在尝试将Vue与Typescript，nuxt.js结合使用，但更具体的方法是，不使用装饰器或样式类组件，而仅继续使用普通的Vue语法

这是我在Vuex商店中的代码

/store/todos/types.ts

export interface Todo {
  id: number
  text: string
  done: boolean
}

export interface TodoState {
  list: Todo[]
}

/store/todos/state.ts

import { TodoState } from './types'

export default (): TodoState => ({
  list: [
    {
      id: 1,
      text: 'first todo',
      done: true
    },
    {
      id: 2,
      text: 'second todo',
      done: false
    }
  ]
})

/store/todos/mutations.ts

import { MutationTree } from 'vuex'
import { TodoState, Todo } from './types'

export default {
  remove(state, { id }: Todo) {
    const index = state.list.findIndex((x) => x.id === id)
    state.list.splice(index, 1)
  }
} as MutationTree<TodoState>

/store/todos/actions.ts

import { ActionTree } from 'vuex'
import { RootState } from '../types'
import { TodoState, Todo } from './types'

export default {
  delete({ commit }, { id }: Todo): void {
    commit('remove', id)
  }
} as ActionTree<TodoState, RootState>

/store/todos/getters.ts

import { GetterTree } from 'vuex'
import { RootState } from '../types'
import { TodoState, Todo } from './types'

export default {
  list(state): Todo[] {
    return state.list
  }
} as GetterTree<TodoState, RootState>

这是我拥有的组件代码，

<template>
  <div>
    <ul>
      <li v-for="todo in todos" :key="todo.id">
        {{ todo.text }}
        <button @click="destroy(todo)">delete</button>
      </li>
    </ul>
  </div>
</template>

<script lang="ts">
import Vue from 'vue'
import { mapGetters, mapActions } from 'vuex'

export default Vue.extend({
  computed: {
    ...mapGetters({
      todos: 'todos/list'
    })
  },
  methods: {
    ...mapActions({
      destroy: 'todos/delete'
    })
  }
})
</script>

一切正常，除了来自Vuex的吸气剂或动作的自动完成/智能感知之外，>

有人可以帮助我吗？

感谢此o /

我使用Vue.js和Vuex已有一段时间，但始终使用javascript。我正在尝试将Vue与Typescript，nuxt.js结合使用，但不使用装饰器或样式类组件，而仅...

Answer 1

Vuex，以当前形式，不适用于Typescript。这可能会在Vue 3中改变。

就像您一样，我也不想使用@Component装饰器，特别是因为它们已被弃用。但是，当使用默认的Vue打字稿组件样式时：