美文网首页
当前路由下进行跳转

当前路由下进行跳转

作者: Doki_455c | 来源:发表于2019-01-13 15:25 被阅读0次

业务需求是点击收入类预算,可以将当前的路由进行一次跳转。效果是刷新当前路由,并且将高亮恢复到第一个默认值

标题使用了element ui组件的面包屑。问题是出在当前的路由,因为vue-router会自动识别是否是当前路由,如果是点击当前的路由是不会发生跳转。

最初使用了页面刷新的效果,发现用户体验度很低,而且页面上会出现空白。

网上查到了方法,点击时将页面写一个空白的路由通过路由传参的方式,将路由跳过去,并把path和name传递过去。

面包屑组件

通过点击事件将数组内的path和name值传过去

跳空白路由

跳路由发现会出现点击时不会进行跳转的问题,使用了this.$nextTick的方法。

跳到空白页之后

肉眼是看不到变化,但是却实现了将当前路由进行跳转的功能

相关文章

  • 当前路由下进行跳转

    业务需求是点击收入类预算,可以将当前的路由进行一次跳转。效果是刷新当前路由,并且将高亮恢复到第一个默认值 标题使用...

  • 微信小程序的周期解析

    微信小程序中的路由跳转方式(传参)通过navigateTo({})来进行页面的跳转 注意:保留当前页面,跳转到应用...

  • Vue的路由钩子

    在某些情况下,当路由跳转前和跳转后、离开、进入某个路由需要做一些操作,这就需要在路由钩子里面进行相应的操作。 路由...

  • Flutter GetX基础教程(五):Navigation路由

    使用GetX 进行路由跳转非常的简单,只需要调用Get.to()即可进行路由跳转,而系统的路由跳转需要写八行代码,...

  • 动态路由理解

    一、通过配置动态路由进行页面跳转同时进行参数传递 1、配置路由 2、跳转设置 ----------》注意这种方式...

  • Vue中监听地址栏路由改变

    有时在遇到需要跳转子路由时让当前父路由隐藏,子路由显示可使用

  • 工作心得

    使用element菜单跳转到不同的路由下,当前导航激活 这里只需要开启router,然后在index里写路由,之后...

  • vue同路由跳转页面不刷新的解决方案

    场景:使用router-view时,如果在相同路由之间跳转,默认在跳转路由时会采用缓存策略,并不会刷新当前路由组件...

  • vue同路由跳转页面不刷新的解决方案

    场景:使用router-view时,如果在相同路由之间跳转,默认在跳转路由时会采用缓存策略,并不会刷新当前路由组件...

  • router-link标签的简单使用

    vue项目的链接代替标签,router-link相当于a标签。to约等于href 跳转当前子路由直接传子路由 跳转...

网友评论

      本文标题:当前路由下进行跳转

      本文链接:https://www.haomeiwen.com/subject/naokdqtx.html