Vue中路由多路径动态传参-Vue-前端日记簿

首页 Vue 正文

Vue中路由多路径动态传参

2023-09-22 77

单一路径传参：

动态传参就是当我们点击某一个组件时附带传过去的参数，例如

var User = { template:"<div>用户：{{$route.params.id}}</div>"}
var myRouter = new VueRouter({
    //routes是路由规则数组
    routes: [
        //通过/:参数名  的形式传递参数 
        { path: "/user/:id", component: User },
    ]
})

当我们在路由中动态绑定传入一个id时可以在router-link路径中去传参

通过打印$route 我们可以在输出台中获取到我们传递过去的值以及其他数据

然后通过this.$route.params.id或者username写在插值表达式中显示在页面上

也可以在一个路径里面传递多个参数或者设置多个路径进行传参

标签：

发表评论：取消回复

原文链接：http://1.15.94.33/?id=51

=========================================

http://1.15.94.33/ 为 “前端日记簿” 唯一官方服务平台，请勿相信其他任何渠道。