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 ...
随机推荐
- vue data functions should return an object
报错: 原因:data里没写return{}
- Mac预览怎么用 Mac预览功能实用技巧大全
Mac预览怎么用?有很多的用户以为Mac自带的预览功能只具有简单的图片浏览功能,其实不然,其实"预览"是一款强大的看图.修图.改图软件,也同时是一款多功能的 PDF 阅读与编辑工具 ...
- 在ubuntu18.04上安装nodejs14
步骤 1:更新 在 Ubuntu 上运行 apt update 命令以更新软件包库内容数据库. sudo apt update 第 2 步:在 Ubuntu 18.04 上安装 Node.js 14 ...
- 如何在 Linux 上扫描/检测新的 LUN 和 SCSI 磁盘
当 Linux 系统连接到 SAN(存储区域网络)后,你需要重新扫描 iSCSI 服务以发现新的 LUN. 要做到这一点,你必须向存储团队提供 Linux 主机的 WWN 号和所需的 LUN 大小. ...
- nginx 添加ssl认证,访问静态资源 笔记
1.查看是否开启SSL模块, /usr/local/nginx/sbin ./nginx -V 2.没有开启,进入到nginx源码包目录下: 3编译 ./configure --prefix= ...
- list与linkedlist(添加、删除元素)
1)jdk1.8中list遍历过程中可以直接删除元素了(jdk1.7可以通过倒序遍历删除或iterator遍历删除元素) List<Integer> list = new ArrayLis ...
- uniapp 报错 签名不对 请检查签名是否与开放平台上填写的一致
问题描述 用签名工具 输入包名 获取签名 在微信开放平台申请app 用获取的签名申请 申请成功后 在hbuilderx上云打包apk 分享 报 签名不对 请检查签名是否与开放平台上填写的一致 ...
- 【Android异常】关于静态注册BroadcastReceiver接收不到系统广播的问题
如果你静态注册的广播无法接收到消息,请先检查下:你的安卓版本是不是8.0+ 前言Google官方声明:Beginning with Android 8.0 (API level 26), the sy ...
- 面向对象程序设计 第二章 C++简单的程序设计
目录 C++语言的特点 1.兼容C语言 · 它保持了C的简洁.高效和接近汇编语言等特点. · 对C的类型系统进行了改革和扩充. · C++也支持面向过程的程序设计,不是一个纯正的面向对象的语言 2.支 ...
- Docker系列--容器编排工具Docker Compose详解
1.Docker Compose 概述 Compose是一个用于定义和运行多容器Docker应用程序的工具.使用Compose,您可以使用Compose文件来配置应用程序的服务.然后,使用单个命令,您 ...