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图标偶尔乱码问题
文章描述了在使用若依框架开发过程中遇到的图标乱码问题,通过分析发现是由于sass编译器将Unicode编码转换为明文导致的,文章提供了四种处理方法:使用css-unicode-loader、升高sass版本、替换element-ui的样式文件和更换打包压缩方式2025-01-01
Vue3.2 新增指令 v-memo 用法详解(提高性能利器)
v-memo 接受一个依赖的数组,依赖的数组变化,v-memo 所对应的 DOM 包括子集将会重新渲染,这篇文章主要介绍了Vue3.2 新增指令 v-memo 用法,提高性能的又一利器,需要的朋友可以参考下2022-09-09
Vue Router路由hash模式与history模式详细介绍
Vue Router是Vue.js官方的路由管理器。它和Vue.js的核心深度集成,让构建单页面应用变得易如反掌。路由实际上就是可以理解为指向,就是我在页面上点击一个按钮需要跳转到对应的页面,这就是路由跳转2022-08-08
vue配置生产环境.env.production与测试环境.env.development
这篇文章主要介绍了vue配置生产环境.env.production与测试环境.env.development方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10


最新评论