zoukankan      html  css  js  c++  java
  • this.$router.push、replace、go的区别

    1.this.$router.push()

    描述:跳转到不同的url,但这个方法会向history栈添加一个记录,点击后退会返回到上一个页面。

    用法:

      this.$router.push('/index')
      this.$router.push({path:'/index'})
      this.$router.push({path:'/index',query:{name: '123'}})
      this.$router.push({name:'index',params:{name:'123'}})
     // 字符串
    
      router.push('home')
      // 对象
      this.$router.push({path: '/login?url=' + this.$route.path});
      // 带查询参数,变成/backend/order?selected=2
      this.$router.push({path: '/backend/order', query: {selected: "2"}});
      // 命名的路由
      router.push({ name: 'user', params: { userId: 123 }})
    

      

    2.this.$router.replace()

    描述:同样是跳转到指定的url,但是这个方法不会向history里面添加新的记录,点击返回,会跳转到上上一个页面。上一个记录是不存在的。

    3.this.$router.go(n)

    相对于当前页面向前或向后跳转多少个页面,类似 window.history.go(n)。n可为正数可为负数。正数返回上一个页面

     //声明式:
      <router-link :to="..." replace></router-link>
      // 编程式:
      router.replace(...)
      //push方法也可以传replace
      this.$router.push({path: '/home', replace: true})
    

      

  • 相关阅读:
    log4j学习
    数据库索引
    php 通过exec 创建git分支失败
    Nginx 常用全局变量 及Rewrite规则详解
    Jetbrains phpstorm pycharm 免费授权注册码
    Nginx return 关键字配置小技巧
    PHP 加密 和 解密 方法
    Nginx 禁用IP IP段
    Yii2 捕获错误日志
    transform 实现响应式绝对居中
  • 原文地址:https://www.cnblogs.com/blogxu/p/vue_x.html
Copyright © 2011-2022 走看看