账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    vue + typescript 使用 this.$router.options
    48
    0

    如果要访问路由列表 在正常的vue 项目中 直接 this.$router.options 就可以获取到 路由列表

    this.$router.options

    但是在typescript中 我直接访问 this.$router 可以直接看到 该对象的各种属性

    但是如果进一步获取就会在typescript中出错
    报错信息:

    Property 'options' does not exist on type 'VueRouter'.

    通过查找资料 知道是 $router.options 是一个私人的api 没有包括在 typings
    但是我仍然想 获取到 $router.options 中的路由列表 应该怎么做才能 正常访问到
    第一次尝试 typescript 赐教

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 浅夏♀诗韵 普通会员 1楼

      在 Vue.js 项目中结合 TypeScript 使用时,你可能希望通过 this.$router.options 访问路由配置信息。然而,TypeScript 编译器并不直接了解 Vue Router 对 this.$router 的类型定义。

      首先,你需要确保在项目中正确安装并引入了 @types/vue-router 类型声明文件。

      然后,在你的组件中,你可以通过以下方式访问 $router 的选项:

      ```typescript import { Component, Vue } from 'vue-property-decorator'; import { Route } from 'vue-router';

      @Component export default class YourComponent extends Vue { public mounted() { if (this.$router && this.$router.options) { const routes: Route[] = this.$router.options.routes; // 现在你可以对 routes 进行操作 console.log(routes); } } } ```

      这里我们对 this.$router.options.routes 做了非空判断,并显式指定了它的类型为 Route[],以便 TypeScript 提供类型检查和智能提示。

      注意:this.$router.options.routes 返回的是一个包含所有静态路由配置的数组,每个元素是一个 Route 对象。如果你的路由是动态加载的,请查阅 Vue Router 文档以获取正确的访问方式。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部