一、element plus按钮点击后不会自动失去焦点,该如何解决?

  在按钮点击点击回调中增加以下代码:

  event.target.blur()

  if (event.target.nodeName === 'SPAN') {
    event.target.parentNode.blur()
  }
  模版中:

  JS中:

二、考虑到页面中存在多个按钮,为了解决代码复用用问题,需要定义全局函数并挂载到Vue实例中

  1、新建func.js文件,将上面的代码封装到函数中并导出

  2、main.js中挂载全局函数

  3、组件中使用全局函数

    a、setup方法中导入getCurrentInstance获取Vue实例的上下文

  b、通过vue实例上下文获取全局函数并调用

element plus按钮点击后不会自动失去焦点的解决方案及Vue3中如何挂载全局函数并在组件中使用的更多相关文章

  1. 【前台页面 BUG】回车按钮后,页面自动跳转

    点击回车按钮后,页面自动的迅速跳转 原因: 表单隐式提交了. 解决方法: 在方法执行完成后,加上return false; 代码如下: /** * 注册按钮的点击事件 */ $("#regi ...

  2. Dynamics 365 CE命令栏按钮点击后刷新表单页面方法

    微软动态CRM专家罗勇 ,回复326或者20190428可方便获取本文,同时可以在第一间得到我发布的最新博文信息,follow me! Dynamics 365 Customer Engagement ...

  3. BootStrap中按钮点击后被禁用按钮的最佳实现方法

    //禁用button $('button').addClass('disabled'); // Disables visually $('button').prop('disabled', true) ...

  4. jQuery实现提交按钮点击后变成正在处理字样并禁止点击的方法

    本文实例讲述了jQuery实现提交按钮点击后变成正在处理字样并禁止点击的方法.分享给大家供大家参考.具体实现方法如下: 这里主要通过val方法设置按钮的文字,并用attr方法修改disabled属性实 ...

  5. CSS实现按钮点击后根据背景色加深效果-一颗优雅草bigniu

    具体代码如下 button{ position: relative; } button:active::before { display: block; content: ''; position: ...

  6. vue swiper点击后返回不能自动播放

    解决方法: 在返回时重新开启轮播 组件中: <swiper :options="swiperOption" ref="mySwiper" :class=& ...

  7. javascript实现自动切换焦点功能学习

    当用户在表单中填写完当前字段后,能否自动将焦点跳转到下一个字段以方便用户输入? 为了增强易用性,加快数据输入的速度,可以在前一个文本框中的字符达到一定的设置的字符长度后(比如电话号码,身份证号等),用 ...

  8. [WPF 自定义控件]让Form在加载后自动获得焦点

    1. 需求 加载后让第一个输入框或者焦点是个很基本的功能,典型的如"登录"对话框.一般来说"登录"对话框加载后"用户名"应该马上获得焦点,用 ...

  9. [WPF自定义控件库] 让Form在加载后自动获得焦点

    原文:[WPF自定义控件库] 让Form在加载后自动获得焦点 1. 需求 加载后让第一个输入框或者焦点是个很基本的功能,典型的如"登录"对话框.一般来说"登录" ...

  10. 构建自己的PHP框架之自动加载类中详解spl_autoload_register()函数

    在了解这个函数之前先来看另一个函数:__autoload. 一.__autoload 这是一个自动加载函数,在PHP5中,当我们实例化一个未定义的类时,就会触发此函数.看下面例子: printit.c ...

随机推荐

  1. Mac如何用鼠标快速锁屏

    锁屏谁不会啊?本来写这篇文章,感觉自己太多余,但用鼠标直接锁屏就有点小意思,Mac对于很多人来说非常模式,通常是商务.设计这类人事在使用,对于新手而言,它的功能过于隐藏,那么Mac要如何达到快速锁屏呢 ...

  2. 逆向学习物联网-网关ESP8266-05课程小结

    1. 移花接木 本章利用自己设计的网关代替体验系统中的网关,开启了分模块设计系统的设计模式. 2.透明传输 终端传输来的数据,以MQTT协议透明传输到云及其他订阅者,简化终端系统的设计. 3. 利用状 ...

  3. HCIP-进阶实验02-ISIS协议部署

    进阶实验02-ISIS协议部署 1 实验需求 设备 接口 IP地址 备注 R1 G0/0/0 10.1.123.1/24 R2 G0/0/0 10.1.123.2/24 G0/0/1 10.1.24. ...

  4. springboot自动装配静态成员变量

    首先要说的是,springboot并不能装配静态类,但可以通过以下骚操作来实现: @Component public class StatisticLogger { private static Da ...

  5. SQL----EXISTS 关键字EXISTS基本意思

    1.EXISTS基本意思 英语解释就是存在,不过他的意思也差不多,相当于存在量词'З'.他不返回数据的,当后带带的查询为空值是,返回"FALSE",非空则返回"TRUE& ...

  6. Docker基本命令之 容器管理

    容器管理 查看正在运行的容器: docker ps 查看完整信息:docker ps --no-trunc 查看在运行或停止运行的容器:docker ps -a 查看容器系统资源的使用情况:docke ...

  7. mysql零基础-2

    更新中的数据完整性错误 UPDATE employees SET department_id = 55 WHERE department_id = 110; 删除数据 删除一条记录 DELETE FR ...

  8. java 递归查子菜单

    递归查: @Override public List<PromotionOrgInfoPO> queryOrgInfo() { List<PromotionOrgInfoPO> ...

  9. Java基础面试笔试大汇总

    1面向对象的特征有哪些方面? 抽象:抽象是将一类对象的共同特征总结出来构造类的过程,包括数据抽象和行为抽象. 继承:继承就是从已有的类得到继承信息创建新类的过程 封装:封装就是把数据和操作数据的方法绑 ...

  10. java 操作 zookeeper

    pom.xml<dependency> <groupId>com.101tec</groupId> <artifactId>zkclient</a ...