vue 路由 有子路由的父级路由跳转到根路径

最新推荐文章于 2024-06-20 10:26:21 发布
最新推荐文章于 2024-06-20 10:26:21 发布
阅读量3.9k 收藏
点赞数 1
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43952634/article/details/104008726
版权

路由跳转时，如果直接使用 this. r o u t e r . p u s h ( n a m e / p a t h : " x x x " ) 将 会 跳 转 到 子 路 由 如 果 需 要 跳 转 到 根 路 由 时 需 要 在 p a t h 前 加 “ ” / “ ” t h i s . router.push({name/path:"xxx"}) 将会跳转到子路由 如果需要跳转到根路由时 需要在path前加“”/“” this. router.push(name/path:"xxx")将会跳转到子路由如果需要跳转到根路由时需要在path前加“”/“”this.router.push({name/path:"/" + “xxx”})
要注意，以 / 开头的嵌套路径会被当作根路径。

ajzzz
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue 获取根节点_一个 Vue 模板可以有多个根节点(Fragments)?
weixin_39570505的博客
01-26 1496
如果我们试图创建一个没有根节点的Vue模板，比如这样：Node1Node2我们就会收到编译或运行时错误，因为模板必须具有单个根元素。通常，我们通过在最外层包裹一层 div 来解决这个问题，但这个div元素一般没有啥使用，就是让模板符合单根需求。Node1Node2这样的方式通常问题不在，但是在某些情况下，拥有多根模板是必要的。在本文中，我们来探讨一下何时需要...
vue拿到某个节点的属性_vue实现将某个dom元素或组件挂载到根节点
weixin_42515063的博客
01-14 2291
在写手机端的时候经常用到tab，tab切换一般都是transition滑动的，如果此时我们用position:fixed定位会发现，元素定位并不是我们想象中的相对浏览器定位，这是因为fixed定位会被拥有transition属性的元素影响。为了结果这个问题，我们需要将元素变成相对于浏览器定位，这个时候我们就要将这个需要定位的dom元素挂载到根节点下，实现方式如下1.vue2.0的实现方式1.1 将...
vue router 跳转方式
weixin_46225592的博客
06-13 2105
1.router-link 不带参数 //name,path都行, 建议用name // 注意：router-link中链接如果是’/‘开始就是从根路由开始，如果开始不带’/’，则从当前路由开始。 2.带参数 // params传参数 (类似post) // 路由配置 path: “/home/:id” 或者 path: “/home:id” // 不配置path ,第一次可请求,刷新页面id会消失 // 配置path,刷新页面id会保留 // html 取参 route.params.id//
Vue项目的详细目录结构解析
最新发布
weixin_45131680的博客
06-20 1225
我们在使用Vuevue-demo├── dist //项目构建后的输出目录├── public├── src├── tests //选装：测试模块├── ...dist—— 项目构建打包后的默认输出目录。查看详情 ->—— 项目依赖文件，其中包括很多基础依赖和自己安装的依赖。查看详情 ->public—— 存放公共资源和项目的主入口文件index.html。查看详情 ->src—— 项目核心文件夹：包括项目源码，各种静态资源等等。是我们开发的重点工作目录。查看详情 ->test。
vue 父子路由跳转 （默认选中主路由）
weixin_45102212的博客
12-08 1563
最近项目遇到路由，父子路由跳转默认选中路由。每次一看到路由就懵逼 主页面： 导航的菜单是循环路由得出来的，因此点击跳转子页面是这样的 导航菜单代码： <el-menu router :default-active="defaultActive" mode="horizontal" active-text-color="rgba(68, 100, 255, 1)"> <template v-for="(item,val) in data" >
vue路由回到原来的路由，其页面的数据标签不变
m0_50981596的博客
05-11 798
今天做项目时，涉及到在一个页面进行tab标签切换，并输入部分数据，后跳转另一个页面，但是，从另一个页面退回到原来路由时，原来页面上的数据会消失，就要重新填写一边，很麻烦，在网上查了很多，找到了方法。 App.vue 在第二个页面写入 或者直接在 router的index.js写 ...
vue相同路由跳转强制刷新该路由组件操作
10-14
在Vue.js应用中，路由是...在进行路由跳转和组件刷新时，理解Vue Router的工作原理至关重要，这可以帮助我们编写出更加灵活且可维护的代码。同时，遵循最佳实践和避免常见错误，如路由命名冲突，也能提高应用的质量。
Vue实现路由跳转和嵌套
08-30
Vue 实现路由跳转和嵌套 在 Vue 中实现路由跳转和嵌套是非常重要的，今天我们将介绍如何使用 Vue 实现路由跳转和嵌套。首先，我们需要安装 Vue Router，使用以下命令安装：`cnpm i vue-router -D` ### 配置路由 ...
Vue路由跳转问题记录详解
08-30
在本文中，我们将深入探讨一个具体的Vue路由跳转问题，以及如何解决这个问题。 首先，我们要了解Vue Router的基本结构。在示例中，我们看到这样的路由配置： ```javascript { path: '/tab', component: Tab, ...
Vue利用路由钩子token过期后跳转到登录页的实例
08-29
本篇将详细介绍如何利用Vue Router的路由钩子来实现在用户token过期后自动跳转到登录页。 Vue Router提供了多种类型的钩子，包括全局导航钩子、单个路由独享的钩子以及组件内的钩子。这些钩子的主要作用是在路由...
vue router 页面跳转
lch_blog
07-02 279
平级页面跳转 不要 app.vue 作为 根路径的 component 如果以App.vue 作为根路径的componet, 那么每次 跳转到子路径的时候， 会先展示 App.vue的内容，再在下面 展示 子路径其他的内容. 路由嵌套 若要实现跳转到下一级路径后，先展示上级/父级的页面，再展示子路径的内容 —> children. 然后再Main.vue中，添加 <router-view/> ...
vue填坑系列之子路由视图一个根节点
xuxinwen32的博客
03-07 679
因为是子视图模板，在template渲染页面的时候我就没有加上根节点，no101.vue子路由视图将在Main.vue上面进行渲染，因为有嵌套关系，两个节点是平行关系，导致编译的时候直接报错 Component template should contain exactly one root element. If you are using v-if o...
vue 页面嵌套iframe页面进行跳转
xiyuanoo的博客
02-06 1182
vue 嵌套iframe页面进行页面间跳转。以若依为例
Vue 父路由和子路由
weixin_42914989的博客
03-01 3508
Vue 父路由和子路由 以黑马项目二leyou商城的前端界面为例 我们在访问localhost:9001时候首先会进入index.html和读取main.js main.js里面包含了new Vue（{}）,我们看一下里面参数：router。 router是路由，负责把数据渲染#app的元素上的< template> 寻着线索我们再来打开router.js文件 首先看到的是下图的routes routes是一个路由数组，里面可以设置需要映射的路径。 父路由 访问localhost:9001/
vue router-link子级返回父级页面
weixin_30737433的博客
04-12 727
vue-router嵌套路由，从二级路由跳转到一级路由时，间歇性导致一级路由重叠 解决方法： 1.使用this.$router.push跳转 转载于:https://www.cnblogs.com/Kyaya/p/10697709.html...
vue 子路由如何调用父路由中的方法
weixin_46852620的博客
02-13 1763
在父路由界面中有部分是子路由的内容，而问题是子路由的操作完成后需要调用父路由的一个方法来改变父路由中的样式 main.js Vue.prototype.$bus = new Vue() 父路由页面 <template> <router-view></router-view> </template> export default { name: "father", mounted() { let _this = this
vue父路由调用子路由方法及子路由调用父路由方法
weixin_52131798的博客
08-26 1603
父路由调用子路 合理运用ref属性 <template> <div> <router-view ref="Childmain"/> </div> </template> <script> created(){ this.$refs['Childmain'].childe() } </script> 调用时可能会出现报错,没猜错的话报错原因是子路由还未加载，这
Vue.router中的嵌套路由,和跳转的四种方式
最爱喝怡宝的博客
12-16 5742
嵌套路由（又叫 嵌套子路由）嵌套路由--- 通常由多层嵌套的组件组合而成。 1:router-view的细分 router-view第一层中，包含一个router-view 2:每一个坑挖好了，要对应单独的组件 路由配置 routes: [ { path:'/menu', name:'menu', component:menu, //路由嵌套增加
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值