【Vue Router】strict 和 sensitive 的区别

科技艺术

已于 2024-01-19 21:09:24 修改

阅读量1.5k

点赞数 1

文章标签： javascript vue.js 前端

于 2023-07-19 15:52:30 首次发布

本文链接：https://blog.youkuaiyun.com/zhengh513/article/details/131810940

版权

VueRouter默认不区分路由大小写且能匹配带或不带尾部斜线的路径。通过设置`strict`和`sensitive`选项，可以改变这一行为。例如，`strict:true`禁止匹配尾部斜线路由，而`sensitive:true`使路由区分大小写。这些选项可全局应用，也可针对单个路由配置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文档

默认情况下，所有路由是不区分大小写的，并且能匹配带有或不带有尾部斜线的路由。例如，路由 /users 将匹配 /users、/users/、甚至 /Users/。这种行为可以通过 strict 和 sensitive 选项来修改，它们既可以应用在整个全局路由上，又可以应用于当前路由上：

const router = createRouter({
  history: createWebHistory(),
  routes: [
    // 将匹配 /users/posva 而非：
    // - /users/posva/ 当 strict: true
    // - /Users/posva 当 sensitive: true
    { path: '/users/:id', sensitive: true },
    // 将匹配 /users, /Users, 以及 /users/42 而非 /users/ 或 /users/42/
    { path: '/users/:id?' },
  ],
  strict: true, // applies to all routes
})