美文网首页
路由传参的三种方式

路由传参的三种方式

作者: 用心为你 | 来源:发表于2020-04-13 13:54 被阅读0次

    方法一:

        path:`/home/${id}`,
    })
    
    路由配置
    {
        path:"/home/:id",
        name:"Home",
        component:Home
    }
    在Home组件中获取参数值
    this.$route.params.id
    

    方法二:

    this.$router.push({
        name:'Home',
        params:{
            id:id
        }
    })
    用params传递参数,不使用:/id
    {
        path:'/home',
        name:Home,
        component:Home
    }
    Home组件中获取参数
    this.$route.params.id
    

    方法三:

    path+query;query传递的参数会通过?id = xxx展示

    this.$router.push({
        path:'/home',
        query:{
            id:id
        }
    })
    路由配置
    {
        path:'/home',
        name:Home,
        component:Home
    }
    获取参数的方法
    this.$route.query.id
    
    

    相关文章

      网友评论

          本文标题:路由传参的三种方式

          本文链接:https://www.haomeiwen.com/subject/rmmgmhtx.html