Bug:Vue路由不跳转而是刷新页面

简介: Bug:Vue路由不跳转而是刷新页面

问题

Vue路由不跳转而是刷新页面

解决

经过同事的仔细观察,发现点击跳转时,路由中多了一个【问号】并刷新页面没有发生跳转,再次点击才生效

方式一

使用了click.prevent阻止form表单的默认提交事件

<button @click.prevent="onSubmit" >登录</button>

方式二

button默认是submit类型,改成type=“button”

<button type="button"></button>

方式三

把 el-form 组件去掉。 因为也没什么必要,加了form 无非就是 在两个input 中按回车能自动提交

<el-row>

<el-input v-model.trim="keywords" @keyup.enter.native="search()">
<el-button icon="el-icon-search" @click="search()">搜索</el-button>
</el-input>
</el-row>

最后用方式3解决了问题

参考

Vue点击登录的时候自动加了问号?

            </div>
AI 代码解读
目录
打赏
0
0
0
0
227
分享
相关文章
|
11月前
|
【vue】如何跳转路由到指定页面位置
【vue】如何跳转路由到指定页面位置
244 0
vue中页面的跳转
vue中页面的跳转
70 0
Vue怎么通过路由实现页面的局部跳转
Vue怎么通过路由实现页面的局部跳转
375 0
|
7月前
|
vue页面跳转取消上一个页面请求
本文介绍了在Vue中如何取消上一个页面的请求,以避免页面跳转时请求未完成导致的数据错误。核心方法是使用axios的请求拦截器设置请求的取消令牌(cancelToken),并在vuex中存储这些取消令牌的引用。当进行路由跳转时,通过路由守卫清除这些请求,达到取消上一个页面请求的目的。
293 2
vue3 Elementplus 动态路由菜单不跳转问题
vue3 Elementplus 动态路由菜单不跳转问题
265 1
|
9月前
|
vue常用跳转方式大全,vue站内跳转和打开新页面跳转
vue常用跳转方式大全,vue站内跳转和打开新页面跳转
1030 1
vue3路由跳转方法
首先,vue3.0跳转和vue2.0跳转方式差别不大,但是还有需要注意的地方。这里我介绍两种比较常见的路由跳转方法。
vue3的路由跳转
vue3的路由跳转
106 0
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等