1

在我的文章router.ts中，我添加了一些具有“getter”的元属性，然后我有兴趣在加载该组件时使用。

{
    path: "attachments",
    name: "AdminJobsAttachments",
    meta: {
        navbarName: "Attachments",
        getter: "Jobs/getJob", // <- this
    },
    component: () =>
        import("@/views/common/Attachments.vue"),
},

当组件加载时，我检索该信息，如下所示：

<script lang="ts">
import { defineComponent, ref, computed } from "vue";
import { useRoute } from "vue-router";
import { useStore } from "vuex";

export default defineComponent({
    setup() {
        const route = useRoute();
        const store = useStore();
        const getter = computed(() => route.meta.getter);
        const routeParam = ref(route.params.id);
        const model = computed(() =>
            store.getters[getter.value](routeParam.value)
        );

        return {}
    }
})

但是，Typescript 给了我以下错误：

类型“未知”不能用作索引类型。

我对 Typescript 很陌生，所以这可能是我忽略的东西，但我无法弄清楚如何解决这个问题。

任何帮助表示赞赏。

4

1 回答 1

1

文档

可以通过扩展RouteMeta接口来输入元字段：

// typings.d.ts or router.ts
import 'vue-router'

declare module 'vue-router' {
  interface RouteMeta {
    // must be declared by every route
    navbarName: string
    // is optional - does not have to be on every route
    getter?: string
  }
}

请注意，getter声明为可选属性，您需要在使用它之前测试它的存在...

于 2021-08-31T19:22:50.447 回答