美文网首页
34.vue路由跳转参数的携带

34.vue路由跳转参数的携带

作者: yaoyao妖妖 | 来源:发表于2018-09-07 14:39 被阅读9次

1.路由简单单参数传递

{
    name: 'PicOpera',
    path: 'home/pic_operator_list/:operate_type(\\d+)',
             component: PicOperatorList,
   this.operateType = parseInt(this.$route.params.operate_type)
}
使用的时候直接将:operate_type(\\d+)替换成对应的数值即可

路由的配置

           {
             path: '/picoperate',
             component: PicOperate,
             name: 'PicOperate',
           }


传参

   // 跳转预览大图的界面
   skipToBigPic () {
     this.$router.push({
       path: '/picoperate',
       name: 'PicOperate',
       params: {
         commodityno: 'no',
         picurl: require('../../../src/assets/image/add-default-pic.png')
       }
     })

接收

   getParams () {
     // 取到路由带过来的参数
     let routeParams = this.$route.params
     // 将数据放在当前组件的数据内
     if (routeParams !== undefined) {
       this.picurl = routeParams.picurl
       this.commodityno = routeParams.commodityno
     }

相关文章

网友评论

      本文标题:34.vue路由跳转参数的携带

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