vue $router都有哪些方法

  • 原创
  • |
  • 浏览：2810
  • |
  • 更新：
  • vue $router都有哪些方法1
  • vue $router都有哪些方法2
  • vue $router都有哪些方法3
  • vue $router都有哪些方法4
  • vue $router都有哪些方法5
  • vue $router都有哪些方法6
分步阅读

$router、vue router这些都有一个统一的名称叫做路由管理。

那什么是路由管理呢？

通俗一点就是可以将编辑好的页面统一在路由中进行定义，并且打上标签，然后可以通过这个标签进行页面的访问，那在路由管理中常见的方法有哪些？

vue $router都有哪些方法

工具/原料

  • vue
  • router

$router.push

  1. 1

    $router.push({path:'demo'});

    此方式为通过路由的path地址进行访问

    vue $router都有哪些方法
  2. 2

    router.push({ name: 'demo', params: { userId: '1' }})；

    此方式为通过name进行访问，并进行userId传参。参数传递通过/方式进行传递

    vue $router都有哪些方法
  3. 2
    该信息未经许可获取自百度经验
  4. 3

    router.push({ path: 'demo', query: { plan: 'test' }})；

    此方式为通过path地址访问，并可以传递多个参数，只是访问时，需要通过使用？的方式来在URL上传递参数

    vue $router都有哪些方法
    END

router.replace(path)

  1. 1

    此方法类似router.go(path) ，但是有本质区别，此方法不会在浏览器的栈顶历史创建一条新的纪录，而是进行替换，但push为创建一条新的

    vue $router都有哪些方法
    END

router.go(number)

  1. 1

    router.go(number)为通过数字进行页面跳转，当为-1时，为跳转到前一个界面，当为1时为跳转到后一个界面，在使用router.go(number)时，必须注意一点就是栈顶history中需要有记录，才能实现跳转，如果没有记录则不能进行跳转。

    vue $router都有哪些方法
    END

注意事项

  • 由于篇幅有限，本期先主要介绍上述三种方法的使用，后续会继续更新
经验内容仅供参考，如果您需解决具体问题(尤其法律、医学等领域)，建议您详细咨询相关领域专业人士。
作者声明：本篇经验系本人依照真实经历原创，未经许可，谢绝转载。
展开阅读全部