zoukankan      html  css  js  c++  java
  • vue-router 编程式路由

    $route -> 使用它的属性

    $router-> 使用它的方法

    编程式的导航,即js控制跳转

    //声明式:<router-link :to="...">
    //编程式:this.$router.push('home')

    另一种跳转

    //声明式:<router-link :to="..." replace>
    //编程式:this.$router.replace('home')

    $router.push

    放入跳转的路由/路径

    想要导航到不同URL,则使用 router.push 方法

    //比如:this.$router.push('/c')

    push可以是字符串可以是对象也可以带查询参数

    //字符串
    router.push('home')
    
    // 对象
    router.push({ path: 'home' })
    
    // 命名的路由
    router.push({ name: 'user', params: { userId: '123' }})
    
    // 带查询参数,变成 /register?plan=private
    router.push({ path: 'register', query: { plan: 'private' }})

    $router.go

    在 history 记录中向前或者后退多少步,类似window.history.go(n)

    // 在浏览器记录中前进一步,等同于 history.forward()
    router.go(1)
    
    // 后退一步记录,等同于 history.back()
    router.go(-1)
    
    // 前进 3 步记录
    router.go(3)
    
    // 如果 history 记录不够用,那就默默地失败呗
    router.go(-100)
    router.go(100)

    $router.replace(location)

    把当前路径替换成xxx,比如:['/','/a','/c']

    replace 与 push不同的是:

    它不会向 history 添加新记录,而是替换掉当前的 history 记录
    (使用replac跳转的 后腿按钮不能点击 )

     

  • 相关阅读:
    echarts曲线图
    echarts画柱状图
    echarts画环形图
    ppt素材网
    黄元御的桔梗元参汤治疗过敏性鼻炎
    vue双向数据绑定对于数组和新增对象属性不能监听的解决办法
    谈谈vue双向数据绑定问题
    一个不错的中医博客
    javascript 中 keyup、keypress和keydown事件
    浏览器渲染页面的过程
  • 原文地址:https://www.cnblogs.com/theblogs/p/10484902.html
Copyright © 2011-2022 走看看