vue路由上的props属性与组件属性结合

//路由上添加props,设置为true,可以在路由对应的组件上通过接收到路由上的参数
{
    path: '/page/:a/:b',
    component: () => import('@/views/page'),
    name: 'Page',        
    props: true
 }
// 当使用name和params 组合跳转路由也可通过下列方式获取路由参数
//(路由冒号和params参数不能同时使用)   
// 路由跳转 http://127.0.0.1:8080/#/page/1/2
//page组件
 <template>
      <div>
            页面
      </div>
 </template>
<script>
export default {
    name: 'Page',
    //可以通过这种方式接收路由上数据,
    //props:['a','b'],
    created(){
          console.log(this.$attrs) //打印结果{a:1,b;2}
          console.log(this.$attrs.a,this.$attrs.b) //打印结果  1,2
    }
}
</script>

猜你喜欢

转载自blog.csdn.net/uniquepeng/article/details/128790469