VUE中this.$router.push点了后hash地址改变了页面不跳转

 更新时间:2024年11月07日 11:49:19   作者:爱你三千遍斯塔克  
本文主要介绍了VUE中this.$router.push点了后hash地址改变了页面不跳转,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

今天在写代码的时候,爆出了一个问题,在我使用this.$router.push的时候,hash地址改变了,但是页面却不发生跳转。

地址从admin跳转到了login后,仍然没有发生改变

 <van-button type="success" class="" @click="reset">重置</van-button>
<van-button type="primary" class="" @click="login">登录</van-button>

给它绑定一个事件:

reset(){
            this.username = '';
            this.password = '';
        },
        login(){
            if(this.username === 'likaicheng' && this.password === '666666'){
                // 1.存储token
                localStorage.setItem('token','Bearer xxxx')
                // 2.跳转到后台主页
                this.$router.push('/login' )
            }else{
                // 登录失败
                  localStorage.removeItem('token')
            }
        }

将main.js的显示页面改为App.

 加上<router-view>才能跳转页面,具体的做法是首先在App.vue中删除其他的代码,只加上router-view。

 之后点击之后,页面发生改变了。

到此这篇关于VUE中this.$router.push点了后hash地址改变了页面不跳转的文章就介绍到这了,更多相关VUE this.$router.push页面不跳转内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 如何解决elementUI打包上线后icon图标偶尔乱码问题

    如何解决elementUI打包上线后icon图标偶尔乱码问题

    文章描述了在使用若依框架开发过程中遇到的图标乱码问题,通过分析发现是由于sass编译器将Unicode编码转换为明文导致的,文章提供了四种处理方法:使用css-unicode-loader、升高sass版本、替换element-ui的样式文件和更换打包压缩方式
    2025-01-01
  • Vite和Vue CLI的优劣

    Vite和Vue CLI的优劣

    这篇文章主要介绍了Vite比Vue CLI快在哪里,帮助大家更好的理解和使用vue,感兴趣的朋友可以了解下
    2021-01-01
  • Vue3.2 新增指令 v-memo 用法详解(提高性能利器)

    Vue3.2 新增指令 v-memo 用法详解(提高性能利器)

    v-memo 接受一个依赖的数组,依赖的数组变化,v-memo 所对应的 DOM 包括子集将会重新渲染,这篇文章主要介绍了Vue3.2 新增指令 v-memo 用法,提高性能的又一利器,需要的朋友可以参考下
    2022-09-09
  • Vue新玩具VueUse的具体用法

    Vue新玩具VueUse的具体用法

    VueUse 是一个基于 Composition API 的实用函数集合。本文就详细的介绍了VueUse的具体用法,具有一定的参考价值,感兴趣的可以了解一下
    2021-11-11
  • Vue通过ref获取不到$refs问题

    Vue通过ref获取不到$refs问题

    这篇文章主要介绍了Vue通过ref获取不到$refs问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • Vue Router路由hash模式与history模式详细介绍

    Vue Router路由hash模式与history模式详细介绍

    Vue Router是Vue.js官方的路由管理器。它和Vue.js的核心深度集成,让构建单页面应用变得易如反掌。路由实际上就是可以理解为指向,就是我在页面上点击一个按钮需要跳转到对应的页面,这就是路由跳转
    2022-08-08
  • 基于Vue和Element-Ui搭建项目的方法

    基于Vue和Element-Ui搭建项目的方法

    这篇文章主要介绍了基于Vue和Element-Ui搭建项目的方法,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-09-09
  • Vue路由router详解

    Vue路由router详解

    这篇文章主要介绍了vue router 配置路由的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2021-10-10
  • vue配置生产环境.env.production与测试环境.env.development

    vue配置生产环境.env.production与测试环境.env.development

    这篇文章主要介绍了vue配置生产环境.env.production与测试环境.env.development方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10
  • 关于vue-i18n在单文件js中的使用

    关于vue-i18n在单文件js中的使用

    这篇文章主要介绍了关于vue-i18n在单文件js中的使用,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09

最新评论