文章/答案/技术大牛

发布

问带斜线的vue路由器/:param
EN

Stack Overflow用户

提问于 2018-12-21 20:14:43

回答 2查看 6.9K关注 0票数 8

我有一个这样的路由器：

routes: [
    {
      path: '/survey/:surveyHash',
      name: 'survey',
      component: Survey,
      props: true,
    },

在组件中，我试图在道具中获得surveyHash。麻烦的是，当/在surveyHash中有斜杠时，我不能这么做。

vue-路由器有解决方案吗？

vue-router

javascript

vue.js

vue-component

回答 2

Stack Overflow用户

回答已采纳

发布于 2018-12-21 20:45:05

您可以在路由定义中使用自定义匹配模式。

routes: [
    {
      path: '/survey/:surveyHash(.*)',
      name: 'survey',
      component: Survey,
      props: true,
    },

这样，您将得到URL的其余部分，包括surveyHash中的斜杠。

票数 25

Stack Overflow用户

发布于 2019-08-31 23:09:34

有更优雅的解决方案。Vue路由器在外壳下使用路径到regexp模块，并且它有现成的解决方案。

const regexp = pathToRegexp('/:foo*')
// keys = [{ name: 'foo', delimiter: '/', optional: true, repeat: true }]

https://github.com/pillarjs/path-to-regexp#zero-or-more

const regexp = pathToRegexp('/:foo+')
// keys = [{ name: 'foo', delimiter: '/', optional: false, repeat: true }]

https://github.com/pillarjs/path-to-regexp#one-or-more

票数 4

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/53890365

复制

相似问题

问带斜线的vue路由器/:param
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问带斜线的vue路由器/:paramEN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问带斜线的vue路由器/:param
EN