路由传参高性能模式 vue 路由接受参数

最新推荐文章于 2024-09-25 06:14:45 发布

不悔的年代

最新推荐文章于 2024-09-25 06:14:45 发布

阅读量85

点赞数

文章标签： css javascript css3 es6 vue.js

本文链接：https://blog.csdn.net/weixin_44484873/article/details/115191687

版权

路由传参高性能模式 vue 路由接受参数

const router = new VueRouter({
    routes: [{
        path: '/user/:id',
        component: User,
        props: true
    }]
})




将路由的 props 属性设置为 true 后，组件内可通过 props 接收到 params 参数
export default {
    props: ['id'],
    methods: {
        getParamsId() {
            return this.id
        }
    }
}




另外你还可以通过函数模式来返回 props
const router = new VueRouter({ 
    routes: [{ 
        path: '/user/:id', 
        component: User, 
        props: (route) => ({
         id: route.query.id
         }) 
     }] 
 })