详解Vue router路由

 更新时间:2021年11月19日 16:16:53   作者:维生素D没有用  
这篇文章主要为大家介绍了Vue 的router路由,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助

1.基本使用

 

2.几个注意点

 

3.多级路由(多级路由)

4.路由的query参数

5.命名路由

例如像三级目录 ,每次写都需要带上一二级目录,比较麻烦,采用命名路由可以用name直接找到

 

6.路由的params参数

1)在配置路由的时候需要先声明接收params参数,即先占位

 

2)

 

 7.路由的props配置

 router-linkreplace属性,在开启的时候,此次路由跳转会覆盖上次的路由历史记录。

8.编程式路由导航

 

缓存路由组件,写在include 中的组件才不会在切换的时候被销毁 。不写include就都缓存

9.缓存路由组件

缓存多个的写法:

路由组件相关的两个生命周期钩子:

1.作用:路由组件所独有的两个钩子,用于捕获路由组件的激活状态。

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注脚本之家的更多内容!

相关文章

  • 浅谈vue单页面中有多个echarts图表时的公用代码写法

    浅谈vue单页面中有多个echarts图表时的公用代码写法

    这篇文章主要介绍了浅谈vue单页面中有多个echarts图表时的公用代码写法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-07-07
  • Vue3之使用js实现动画示例解析

    Vue3之使用js实现动画示例解析

    这篇文章主要为大家介绍了Vue3之使用js实现动画示例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-04-04
  • Console高级用法总结

    Console高级用法总结

    Console 对象提供了浏览器控制台调试的接口。在不同宿主环境上它的工作方式可能不一样,但通常都会提供一套共性的功能,本文主要总结了Console的一些高级用法,感兴趣的小伙伴可以参考一下
    2023-04-04
  • 详解Vue源码之数据的代理访问

    详解Vue源码之数据的代理访问

    这篇文章主要介绍了详解Vue源码之数据的代理访问,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-12-12
  • element中el-table与el-form同用并校验

    element中el-table与el-form同用并校验

    本文主要介绍了element中el-table与el-form同用并校验,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-08-08
  • 详解如何创建并发布一个 vue 组件

    详解如何创建并发布一个 vue 组件

    这篇文章主要介绍了详解如何创建并发布一个vue组件,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-11-11
  • vue绑定class与行间样式style详解

    vue绑定class与行间样式style详解

    这篇文章主要介绍了vue绑定class与行间样式style的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08
  • Vue+element自定义指令如何实现表格横向拖拽

    Vue+element自定义指令如何实现表格横向拖拽

    这篇文章主要介绍了Vue+element自定义指令如何实现表格横向拖拽,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-10-10
  • Vue.js组件使用props传递数据的方法

    Vue.js组件使用props传递数据的方法

    这篇文章主要为大家详细介绍了Vue.js组件使用props传递数据的方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-10-10
  • Vue 菜单栏点击切换单个class(高亮)的方法

    Vue 菜单栏点击切换单个class(高亮)的方法

    今天小编就为大家分享一篇Vue 菜单栏点击切换单个class(高亮)的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08

最新评论