element plus按钮点击后不会自动失去焦点的解决方案及Vue3中如何挂载全局函数并在组件中使用
一、element plus按钮点击后不会自动失去焦点,该如何解决?
在按钮点击点击回调中增加以下代码:
event.target.blur()

JS中:

二、考虑到页面中存在多个按钮,为了解决代码复用用问题,需要定义全局函数并挂载到Vue实例中
1、新建func.js文件,将上面的代码封装到函数中并导出

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


3、组件中使用全局函数
a、setup方法中导入getCurrentInstance获取Vue实例的上下文

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

element plus按钮点击后不会自动失去焦点的解决方案及Vue3中如何挂载全局函数并在组件中使用的更多相关文章
- 【前台页面 BUG】回车按钮后,页面自动跳转
点击回车按钮后,页面自动的迅速跳转 原因: 表单隐式提交了. 解决方法: 在方法执行完成后,加上return false; 代码如下: /** * 注册按钮的点击事件 */ $("#regi ...
- Dynamics 365 CE命令栏按钮点击后刷新表单页面方法
微软动态CRM专家罗勇 ,回复326或者20190428可方便获取本文,同时可以在第一间得到我发布的最新博文信息,follow me! Dynamics 365 Customer Engagement ...
- BootStrap中按钮点击后被禁用按钮的最佳实现方法
//禁用button $('button').addClass('disabled'); // Disables visually $('button').prop('disabled', true) ...
- jQuery实现提交按钮点击后变成正在处理字样并禁止点击的方法
本文实例讲述了jQuery实现提交按钮点击后变成正在处理字样并禁止点击的方法.分享给大家供大家参考.具体实现方法如下: 这里主要通过val方法设置按钮的文字,并用attr方法修改disabled属性实 ...
- CSS实现按钮点击后根据背景色加深效果-一颗优雅草bigniu
具体代码如下 button{ position: relative; } button:active::before { display: block; content: ''; position: ...
- vue swiper点击后返回不能自动播放
解决方法: 在返回时重新开启轮播 组件中: <swiper :options="swiperOption" ref="mySwiper" :class=& ...
- javascript实现自动切换焦点功能学习
当用户在表单中填写完当前字段后,能否自动将焦点跳转到下一个字段以方便用户输入? 为了增强易用性,加快数据输入的速度,可以在前一个文本框中的字符达到一定的设置的字符长度后(比如电话号码,身份证号等),用 ...
- [WPF 自定义控件]让Form在加载后自动获得焦点
1. 需求 加载后让第一个输入框或者焦点是个很基本的功能,典型的如"登录"对话框.一般来说"登录"对话框加载后"用户名"应该马上获得焦点,用 ...
- [WPF自定义控件库] 让Form在加载后自动获得焦点
原文:[WPF自定义控件库] 让Form在加载后自动获得焦点 1. 需求 加载后让第一个输入框或者焦点是个很基本的功能,典型的如"登录"对话框.一般来说"登录" ...
- 构建自己的PHP框架之自动加载类中详解spl_autoload_register()函数
在了解这个函数之前先来看另一个函数:__autoload. 一.__autoload 这是一个自动加载函数,在PHP5中,当我们实例化一个未定义的类时,就会触发此函数.看下面例子: printit.c ...
随机推荐
- xshell he xftp下载网址
https://www.xshell.com/zh/free-for-home-school/
- Vue基础(2)双向绑定
双向数据绑定 通过修改标签,例:切换radio.checkbox......都会对绑定的数据有影响 通过事件触发方法,修改data中数据,反向作用于radio.checkbox...... 1.v-m ...
- 服务器部署 halo博客项目
2020-8-9 13:45:14 有个进阶方法! 如果静态资源加载缓慢如图片,头像 则用CDN加速 (确实很秀!) https://cdn.jsdelivr.net/gh/你的用户名/你的仓库 ...
- Spring 装配基础类型
1 //以String类型为例 2 <bean id="exemptSecretUser" class="java.lang.String"> 3 ...
- (jmeter笔记)jmeter监控服务器资源
jmeter版本:5.2.1 jdk版本:1.8.0_191 监控服务器的CPU/memory.IO.硬盘等信息 1.下载jmeter-plugins-manager-1.4.jar 插件,解压之后把 ...
- idea提交时忽略.class、.iml文件和文件夹或目录的方法
第一种方法 在Setings–> Editor --> File Types -->Ignore files and folders中添加需要忽略的文件和文件夹: .idea 忽略 ...
- Linux网络第三章:DNS服务器原理及搭建
目录 一.DNS服务器原理 1.什么是DNS 2.DNS服务器查询过程 二.主备DNS服务器搭建 1.搭建环境 2.检查安装DNS服务 3.修改主服务器配置文件 4.修改备服务器配置文件 5.启动服务 ...
- Spring RMI 介绍
Spring RMI RMI全称是Remote Method Invocation-远程方法调用,是纯Java的网络分布式应用系统的核心解决方案之一.Java RMI 支持存储于不同地址空间的程序级对 ...
- 如何使用autotools/automake自动生成Makefile文件
前言: Linux下编程时,为了方便编译,往往使用Makefile文件自动完成编译,但是Makefile文件本身的书写十分复杂,规则很多.好在Linux为我们提供了自动生成功能完善的Makefile文 ...
- Go语言中密码加密校验
使用go自带的库bcrypt bcrypt是不可逆的加密算法,无法通过解密密文得到明文. bcrypt和其他对称或非对称加密方式不同的是,不是直接解密得到明文,也不是二次加密比较密文,而是把明文和存储 ...