Question

我有以下对象：

  let route = {
    path: "/login",
    name: "login",
    component: Login,
    beforeEnter: (to, from, next) => {
      if (store.state.system.loggedIn) {
        next("/");
      } else {
        next();
      }
    },
  }

这为Vue路由器指定路由对象。问题出在函数beforeEnter上，因为出现TS7006错误-所有参数隐式具有any类型。

我可以手动指定参数类型，但是已经存在beforeEnter函数应该适合的确切类型-它称为NavigationGuard，我可以从vue-router导入它很好。

当我尝试指定它时出现问题，我似乎找不到正确的语法。我发现了问题“ Type definition in object literal in TypeScript”，其中的答案表明要么指定整个对象的类型，要么像这样强制转换：{ hasStarted: <boolean> null, ... }，但用

替换定义

let route = {
    path: "/login",
    name: "login",
    component: Login,
    beforeEnter: <NavigationGuard> (to, from, next) => {
      if (store.state.system.loggedIn) {
        next("/");
      } else {
        next();
      }
    },
  }

似乎并不安抚编译器。

该怎么办？

Answer 1

为了避免与generics混淆，需要括号：

<NavigationGuard>((to, from, next) => {
  // …
})

或者：

((to, from, next) => {
  // …
}) as NavigationGuard

但是您应该可以在父对象上使用键入内容：

let route: RouteConfig = {
  path: "/login",
  name: "login",
  component: Login,
  beforeEnter: (to, from, next) => {
    if (store.state.system.loggedIn) {
      next("/");
    } else {
      next();
    }
  },
}

如何在TypeScript中指定定义为对象文字的箭头函数的类型？

1 个答案: