如何在 typeScript 中为 VueRouter 定义“模式”

【问题标题】：How to define 'mode' in typeScript for the VueRouter如何在 typeScript 中为 VueRouter 定义“模式”
【发布时间】：2020-08-18 17:47:42
【问题描述】：

我是 TypeScript 新手，遇到了这个问题：

export default function ({ store }) {
  const Router = new VueRouter({
    scrollBehavior: () => ({ x: 0, y: 0 }),
    routes,

    // Leave these as they are and change in quasar.conf.js instead!
    // quasar.conf.js -> build -> vueRouterMode
    // quasar.conf.js -> build -> publicPath
    mode: process.env.VUE_ROUTER_MODE,
    base: process.env.VUE_ROUTER_BASE
  })

mode 下划线表示

避免此错误的正确方法是什么？我找到了一个similar issue，但它可能根本不相关。

【问题讨论】：

标签： typescript vue.js vue-router

【解决方案1】：

mode 只接受以下类型的值：

'hash' or(|) 'history' | abstract' | undefined

process.env.VUE_ROUTER_MODE 的类型是string | undefined

由于这些类型不同，打字稿会抱怨你不能分配任何字符串，当只允许特定值时。

在不知道process.env.VUE_ROUTER_MODE 是什么的情况下，您必须将其“强制转换”为这种类型，例如

mode: process.env.VUE_ROUTER_MODE as 'hash' | 'history' | 'abstract' | undefined

如果process.env.VUE_ROUTER_MODE 可以是另一个值，那么编写一个首先检查该值的辅助函数可能会有所帮助。

【讨论】：