zoukankan      html  css  js  c++  java
  • vue之this.$router.query和this.$router.params的使用与区别

    一  this.$router.query的使用:

    router/index.js

     1     {
     2      path:'/mtindex',
     3      component: mtindex,
     4      //添加路由
     5      children:[
     6        {
     7         path:':shopid',
     8         component:guessdetail
     9        }
    10      ]     
    11     },

    2 传参数

    1 this.$router.push({
    2         path: '/mtindex/detail', query:{shopid: item.id}
    3        });

    3 获取参数

    1 this.$route.query.shopid

    4 url的表现形式(url中带有参数)

    http://localhost:8080/#/mtindex/detail?shopid=1

    this.$router.params的使用:

    1 router/index.js

     1 {
     2      path:'/mtindex',
     3      component: mtindex,
     4      //添加路由
     5      children:[
     6        {
     7         path:"/detail",
     8         name:'detail',
     9         component:guessdetail
    10        }
    11      ]     
    12 
    13     },

    2 传参数(params相对应的是name  query相对应的是path)

    1 this.$router.push({
    2         name: 'detail', params:{shopid: item.id}、
    3         });

    3 获取参数

    1 this.$route.params.shopid

    4 url的表现形式(url中没有带参数)

    http://localhost:8080/#/mtindex

  • 相关阅读:
    动态数组arraylist的使用
    第一次
    layui.mobile.css
    index.html
    Ansible部署配置
    微服务项目配置文件
    镜像挂载
    网卡设置
    获取内存信息
    超时方法
  • 原文地址:https://www.cnblogs.com/doudou-song/p/14035977.html
Copyright © 2011-2022 走看看