Vue3-路由跳转专题详细总结(vue路由跳转的三种方法)

编辑：rootadmin

Vue3-路由跳转专题详细总结一、基本路由

推荐整理分享Vue3-路由跳转专题详细总结(vue路由跳转的三种方法)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:vuerouter路由跳转,vuerouter路由跳转,vue路由跳转的三种方法,vue3 路由跳转,vue路由跳转的三种方式及区别,vue路由跳转的三种方式及区别,vue路由跳转的三种方式及区别,vue 路由跳转,内容如对您有帮助，希望把文章链接给更多的朋友！

点击事件似乎可以使用模板更改视图中的内容，个人认为与路由的区别是路由能使网页中的地址栏发生变化请先阅读基础第二篇

1.创建一个组件,并引入

2.js文件中配置路径

//name相当于别名 { path:'/tabView', component:TabView }, { name:'myComPany', path:'company', component:Company, }

3.使用方式

<router-link to="/tabView">首页</router-link>携带参数

query

<router-link :to="{ path: '/tabView', query: { title: 'query路由传值tabView', }, }" >首页</router-link>

query传参可以用name，也可以用path

<router-link :to="{ name: 'myComPany', params: { title: '使用params进行company路由传参必须要用name命名', }, }" >首页</router-link >

只能用name

<router-link :to="`/home/comPus/666/使用params传值`" class="botTabFather" >校园招聘<span class="hotTab" ><p class="txt">hot</p></span ></router-link >

直接在路径中传递，前提要保证路由文件中已经

本文链接地址:https://www.jiuchutong.com/zhishi/295932.html 转载请保留说明！