问题描述:

在vue项目开发过程中,点击按钮结果页面刷新了一遍

后来发现路径变成了 localhost:8080/?#/login

原因:

这里是 form 表单,点击了button 按钮,触发了他的默认事件,就是触发了提交这个行为。

解决方案

使用@click.prevent 阻止默认事件

<button @click.prevent="btnClick">获得验证码</button>

此随笔乃本人学习工作记录,如有疑问欢迎在下面评论,转载请标明出处。

如果对您有帮助请动动鼠标右下方给我来个赞,您的支持是我最大的动力。

解决关于 vue项目中 点击按钮路由多了个问号的更多相关文章

  1. 21、解决关于 vue项目中 点击按钮路由多了个问号

    在vue项目开发过程中,点击按钮结果页面刷新了一遍 后来发现路径变成了 localhost:8080/?#/login 原因: 这里是 form 表单,点击了button 按钮,触发了他的默认事件,就 ...

  2. 解决在Vue项目中时常因为代码缩进导致页面报错的问题

    前言 如果我们初次使用vue-cli来构建单页SPA应用,在撸代码的过程中有可能会遇到这种因为代码缩进导致 页面报错的问题,导致我们烦不胜烦.接下来我们就来看一看如何解决这个小问题... erro原因 ...

  3. 解决:vue项目中多个echarts图表只有最后一个随浏览器变化改变大小

    window.onresize = () => { this.initChart()} 改为 window.addEventListener('resize', () => { this. ...

  4. 解决vue项目中遇到父组件的按钮或操作控制重新挂载子组件但是子组件却无效果的情况

    在vue项目中终会遇到需要父组件的按钮或操作控制重新挂载子组件的需求,我在新项目中就遇到这种需求.真实场景是父组件的早,中,晚三个按钮(代表三个时间段)来控制子组件的table表格列的动态加载. 子组 ...

  5. 如何在Vue项目中,通过点击DOM自动定位VScode中的代码行?

    作者:vivo 互联网大前端团队- Youchen 一.背景 现在大型的 Vue项目基本上都是多人协作开发,并且随着版本的迭代,Vue 项目中的组件数也会越来越多,如果此时让你负责不熟悉的页面功能开发 ...

  6. VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题

    VUE项目中使用this.$forceUpdate();解决页面v-for中修改item属性值后页面v-if不改变的问题:https://blog.csdn.net/jerrica/article/d ...

  7. Vue项目中出现Loading chunk {n} failed问题的解决方法

    最近有个Vue项目中会偶尔出现Loading chunk {n} failed的报错,报错来自于webpack进行code spilt之后某些bundle文件lazy loading失败.但是这个问题 ...

  8. 如何解决vue项目中 scss 不支持 scoped 的 /deep/ 穿透写法

    如何解决vue项目中 scss 不支持 scoped 的 /deep/ 穿透写法 用过vue的人估计都用过scoped样式属性,但有时候需要穿透样式,啥办? 很多资料都说用>>> 或 ...

  9. vue项目中遇到的那些事。

    前言 有好几天没更新文章了.这段实际忙着做了一个vue的项目,从 19 天前开始,到今天刚好 20 天,独立完成. 做vue项目做这个项目一方面能为工作做一些准备,一方面也精进一下技术. 技术栈:vu ...

随机推荐

  1. Filter笔记

    1.Filter [1] Filter简介 > Filter翻译为中文是过滤器的意思. > Filter是JavaWeb的三大web组件之一:Servlet.Filter.Listener ...

  2. python3 爬取搜狗微信的文章

    目标地址:http://weixin.sogou.com/weixin? 这个地址是搜狗微信的文章搜索,可以搜索到微信的文章,而我们目标就是这些文章内容 这个url经过测试,当我们没登陆微信只能看到1 ...

  3. Notes on Distributed System -- Distributed Hash Table Based On Chord

    task: 基于Chord实现一个Hash Table 我负责写Node,队友写SuperNode和Client.总体参考paper[Stoica et al., 2001]上的伪代码 FindSuc ...

  4. python线程——创建和启动

    可以通过实例化一个threading.Thread()对象来创建子线程. import threading import time def listen_music(num): print(" ...

  5. Day07 (黑客成长日记) 函数的参数及作用

    定义函数: 1.定义函数注意: (1)位置参数:直接定义函数. def func(a,b): print(a,b) func(1,2) (2)默认参数:关键字参数:参数名= ‘默认的值‘ def fu ...

  6. 自我理解node.js相比java的优势

    今天学习node.js,相比于之前学习过的java,node.js有一些优越之处.原因是它是一个基于Chrome v8引擎建立的JavaScript运行平台. (1)创建服务器:自行服务器来监听客户端 ...

  7. Charles配置抓取HTTPS请求的Android配置

    关于android手机在mac版charles上抓不到包这个问题困扰了很久,查阅了很多资料,发现是android7.0系统安全策略问题. Charles抓包正常流程1.在手机上配置证书 点击后:直接在 ...

  8. WordPress数据结构分析

    WordPress仅仅用了10 个表:wp_comments, wp_links, wp_options, wp_postmeta, wp_posts, wp_term_relationships, ...

  9. python网络爬虫开发实战(崔庆才)_14页_chromedriver环境配置和加载

    自己1,环境配置,我下载了相对应的Chromedriver(其实我也不知道对不对应,都是下载最新版的我猜应该会对应),然后在任何文件夹下输入command+shift+G,打开输入窗口,任何输入  / ...

  10. Collection类,泛型

    Collection(接口) 所有超级接口: Iterable<E> 一.集合 1.集合的介绍&集合和数组的区别 什么是集合:java中的一种容器 什么是数组:java中的一种容器 ...