Vue中this.$router的使用

时间:2025-04-08 14:56:13
vue中this.$有两种使用方法:
  1. 传入参数且地址栏中带上参数内容

    this.$({path/name: ' 路由 ', query: {key: value}})
    (是path还是name由你自己定,如果是name那么在定义路由的时候需要写明
    类似这种:
    {
      path: '/home',
      name: 'Home',
      component: Home,
      meta:{
        titel:"首页",
        content:"CISSP培训"
      }
    }
    )
    

    这里的请求方法是query
    参数取值的方法是:this.$

  2. 传入参数且地址栏中不带参数内容

    this.$({name: ' 路由的name ', params: {key: value}})
    

    参数的取值方法是:this.$

    由于动态路由也是传递params的,所以在 this.$() 方法中 path不能和params一起使用,否则params将无效,这时就需要用name来指定页面,所以通常我们直接用name会比较好。

关于this.$、replace、go的区别
  1. this.$:跳转到指定url路径,并在history栈中添加一个记录,点击后退会返回到上一个页面。
  2. this.$:跳转到指定url路径,但是history栈中不会有记录,点击返回会跳转到上上个页面。
  3. his.$(n):向前或者向后跳转n个页面,n可为正整数或负整数。
    如果n为0的话,将刷新当前页面。