vue.js路由器中的可选参数

vue.js Vue.js

TonyStafan

2020-03-10

我需要以两种方式路由到某个组件-一种带有参数,一种不带参数。我已经搜索了可选的参数,但是找不到任何信息。

所以我的路线:

{
    path: '/offers/:member',
    component: Offers,
    name: 'offers',
    props: true,
    meta: {
        guest: false,
        needsAuth: true
    }
},

当我以编程方式用参数调用它时,一切都很好

this.$router.push({ path: /offers/1234 });

但是我也需要像这样通过导航

<router-link to="/offers">Offers</router-link>

offers组件接受的丙

props: ['member'],

和这样使用的组件

<Offers :offers="data" :member="member"></Offers>

现在,我设法使其正常工作的丑陋方法是复制路线,并使其中一个不采取支撑措施:

{
    path: '/offers',
    component: Offers,
    name: 'offers',
    props: false,
    meta: {
        guest: false,
        needsAuth: true
    }
},

它实际上有效,但我对此不满意-也在开发模式下,vuejs警告我 [vue-router] Duplicate named routes definition: { name: "offers", path: "/offers" }

当然,有一种方法可以在组件调用中执行可选参数:member="member"

第456篇《vue.js路由器中的可选参数》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

0个回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android