vue实现给div绑定keyup的enter事件
作者:澜岚伊人 发布时间:2024-05-13 09:08:51
摘要:发现给div绑定keyup.enter事件是没有效果的。那该如何实现呢?下面直接上代码吧
1、在template中代码
2、在created的生命周期中,写一个全局的enter事件
这样按下键盘中的enter事件就是有效的了
补充知识:
vue给div绑定keyup的enter事件实现接电话(结合阿里云软电话SDK)
摘要:之前我们的接入的阿里云软电话SDK的功能,现在有个新的需求就是我们自己的弹窗中添加一个按钮可以接听电话,同时可以按键盘的Enter键接电话。(这里的很多废话,是为了记录当时想的逻辑)
实现思路:
1、点击事件接听电话
在create生命周期的时候,监听电话来了的callComming这个事件,此时暂无来电的图片不显示,显示当来来电和电话号码以及接听按钮
在create生命周期的时候,还要监听电话通话的callEstablish这个事件,此时显示当来来电和电话号码以及通话中按钮,接听按钮不显示
在create生命周期的时候,还要监听电话挂断的hangUp这个事件,这里有两种情况:其一就是乘客将电话挂断了,但客服弹窗中的内容并没有填写完,此时就是显示当前来电以及电话号码但不显示任何按钮;其二就是乘客将电话挂断了,客服在弹窗的内容也填写完成了,提交填写的内容后。再次打开弹窗,如果没有来电,则显示暂无来电图片
在弹窗打开的时候,初始化init事件。需要控制暂无来电图片、接听按钮和通话中按钮的显示与否
2、keyup.enter事件
实现思路和点击事件是一样的,唯一不同的就是需要在create生命周期中,添加全局监听enter事件
具体代码如下:
1、在home.vue页面全局使用阿里云的软电话Sdk
2、在我的弹窗写的代码如下:
在template中的代码
在script中的data中的数据
在created生命周期的监听事件
在methods中写接电话的方法:
在打开弹窗的时候methods中写初始化内容:
来源:https://blog.csdn.net/qq_36275889/article/details/90056348
猜你喜欢
- 正则表达式是Python程序设计中非常实用的功能,本文就常用的正则表达式做一汇总,供大家参考之用。具体如下:一、字符串替换1.替换所有匹配的
- 爬取 * 及测试是否可用很多人在爬虫时为了防止被封IP,所以就会去各大网站上查找免费的 * ,由于不是每个IP地址都是有效的,如果要进去
- lambdalambda可以理解为一种小函数,但是它是一个表达式,而不是一个语句,所以在def不允许出现的地方仍然可以使用lambda函数,
- 假如读者已经熟悉了ASP 2.0,并正在寻找3.0版本中的实际改变的列表,那么将在下面发现这些信息。假如读者是一个ASP的初学者,可以越过本
- 本文实例讲述了C语言实现访问及查询MySQL数据库的方法。分享给大家供大家参考,具体如下:1、添加头文件路径(MySQL安装路径中的incl
- 最近尝试了mysql的最新版本5.5.581.最新发布的mysql 5.5.8没有适合solaris 9的版本;这个在安装时需要注意2.它发
- 找到自己的mysql数据库的安装位置,如下 C:\Program Files\MySQL\MySQL Server 5.1,在它里面有个的m
- 前言字符串是 字符的序列 。字符串基本上就是一组单词。我几乎可以保证你在每个Python程序中都要用到字符串,所以请特别留心下面这部分的内容
- 突然有个想法,不知道是不是首创:用"表情符号"做植入广告. 目前的表情符号 "黄色小圆脸"系列可以说
- 1.循环# 1.for...in循环,依次把list或tuple中的每个元素迭代出来studentNames = ["Willar
- 第一:pandas.read_csv读取本地csv文件为数据框形式data=pd.read_csv('G:\data_operati
- 本文实例讲述了Python实现读取机器硬件信息的方法。分享给大家供大家参考,具体如下:本人最近新学python ,用到关于机器的相关信息,经
- 我就废话不多说了,直接上代码吧!import numpy as npa = [2,4,6,8,10]average_a = np.mean(
- 证明出错在dataloader里面在pytorch当中,float16和half是一样的数据结构,都是属于half操作,然后dataload
- 前言今天我看了一下自己的文件夹,发现了自己写了许多似乎很无聊的代码。于是乎,一个想法油然而生:“生活已经很无聊了,不如再无聊一点叭”。说干就
- 功能描述:1)使用tkinter设计程序界面;2)调用Windows API函数实现录音机和音乐播放器。参考代码:运行界面:总结以上所述是小
- 如果你只使用一个更新日志,你只须清空日志文件,然后移走旧的更新日志文件到一个备份中,然后启用新的更新日志。用下列方法可以强制服务器启用新的更
- 在Python中,json指的是符合json语法格式的字符串,可以单行或者多行。它可以方便的在使用在多种语言中,这里介绍的是在python中
- 这篇文章主要介绍了Python如何把多个PDF文件合并,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋
- 想要用python自已手动序列化嵌套类,就要明白两个问题:1.Json是什么?2.Json支持什么类型?答案显而易见Json就是嵌套对象Js