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 ...
随机推荐
- Mysql数据库基础第二章:(七)子查询
Mysql数据库基础系列 软件下载地址 提取码:7v7u 数据下载地址 提取码:e6p9 mysql数据库基础第一章:(一)数据库基本概念 mysql数据库基础第一章:(二)mysql环境搭建 mys ...
- 供配电一次测 PT柜 解释
文章来源: PT柜_百度百科 (baidu.com) 视频介绍 很多电工不清楚的高压PT柜,老电工带你了解工作原理和作用_搜狐汽车_搜狐网 (sohu.com) 很多电工怕PT柜,今天电气成套设计实 ...
- 2022-3-10内部群每日三题-清辉PMP
1.一位项目经理得知,由于持续的罢工,该项目的进口设备尚未被海关放行.项目经理首先应该怎么做? A.执行定性风险分析 B.执行定量风险分析 C.与团队一起审查风险影响 D.实施风险应对计划 2.一位团 ...
- sql 加工后--小文件解决方案
10.24.8.5 # 切换用户 su - hive # 查看表文件 [hive@hadoop-0001 ~]$ hdfs dfs -ls /user/hive/warehouse/bibase.db ...
- Java基础——二维数组
package com.zhao.demo; public class Demo08 { public static void main(String[] args) { //二维数组 int[][] ...
- 【个人笔记】Ubuntu 16.04 LTS 安装 Leanote 二进制版命令记录
此命令根据<Leanote 二进制版详细安装教程 Mac and Linux>操作记录而得. 参考链接:https://github.com/leanote/leanote/wiki/Le ...
- docker 搭建mysql主从复制环境(一主两从)
一主多从配置 服务器规划:使用docker方式创建,主从服务器IP一致,端口号不一致 主服务器:容器名docker-mysql-master,端口3306 从服务器:容器名docker-mysql-s ...
- 3927Circular Sequence 思维题(求环形最大子列和)
Given a sequence with n elements, if the last element is also adjacent to the first element of the s ...
- ant design vue的tooltip的宽度修改不生效
// 注意,vue 项目,style 标签不能加 scoped 选项,否则样式不生效 <a-tooltip placement="top" :overlayClassName ...
- 打包python文件为exe程序 vscode
一.项目下虚拟环境下载pyinstaller.exe 打包 1.检查是否下载 pyinstaller: 如果没有在vscode终端输入:pip3 install pyinstaller 安装成功后下 ...