zoukankan      html  css  js  c++  java
  • vue+element刷新当前路由

    如何做到每次点击相同的路由地址都去渲染页面?

    需求是后台管理系统的菜单导航,点击同一个菜单需要刷新页面,跟之前做多页面应用要达到一样的效果,

    以下是网上找到的方法(我的vue版本是2.5,vue-router 3.0)

    1.加时间戳

        reloadRouter(path) {
          this.$router.push({
            path,
            query: {
              t: +new Date()
            }
          });
        } 

    此方法无效

    2.

        this.$router.go(0);

    此方法有效,但是整个页面都刷新了,

    最后的解决办法是创建一个空的组件,redirect.vue,

    每次点击跳转到redirect空白页,并且以params或者query把当前点击的路由地址传过去,(params传值配置路由时需要name属性)

    redirect页面渲染完成在取到路由带过来的地址在进行跳转,在空白页面的停留时间非常短暂,这点不需要担心。

    完成!

    这里还需提醒一下

    当你点击菜单的时候判断一下是不是相同的路由地址,是的话跳转到redirect,否则正常跳转

    <template>
    </template>
    <script>
    export default {
      name: 'ZRedirect',
      created() {
        const path = this.$router.currentRoute.params;
        this.$router.push(path);
      }
    };
    </script>
        reloadRouter(path) {
          this.$router.push({
            name: 'redirect',
            params: {
              path: path
            }
          });
    
          this.$router.push({
            path: 'redirect',
            query: {
              path: path
            }
          });
        }
  • 相关阅读:
    2.2 Scala基础知识
    Linux---用户及权限管理类命令
    Linux---进程控制类命令
    Linux---vim编辑文本文件
    Linux---文件压缩与解压缩命令
    Linux---查找命令
    Linux---基本目录与文件命令
    nginx配置技巧汇总
    Go 内嵌静态资源
    go语言的time.Sleep
  • 原文地址:https://www.cnblogs.com/luojianjian/p/9377170.html
Copyright © 2011-2022 走看看