【Vue】@keyup.enter @v-model.trim的用法

目录

@keyup.enter

@v-model.trim

情景一:

情景二:


@keyup.enter

作用:监听键盘回车事件

上一篇内容: 记事本

https://blog.csdn.net/m0_67930426/article/details/134630834?spm=1001.2014.3001.5502

这里有个添加任务的功能: 在文本框输入任务,然后点击添加按钮,实现添加功能

我们平常在使用电脑的时候,比如上百度搜索,在文本框内输入你想要搜索的

内容,这时你点回车就能触发网页加载进入相应的页面,这个回车就执行了搜索这个

按钮的功能

这里的@keyup.enter讲的就是这一个概念,我们不点添加按钮,通过enter回车键就能

实现任务的添加

使用@keyup.enter之前

使用@keyup.enter

按回车键

然后添加了跑步这一个任务

@v-model.trim

作用: 将用户输入的前后的空格去掉

情景一:

在文本框输入aaa

然后打开控制台,打开浏览器安装的vue插件

vue插件安装教程:

https://blog.csdn.net/m0_67930426/article/details/134598104?spm=1001.2014.3001.5502

情景二:

aaa前面多了几个空格

再去查看控制台

通过情景一和情景二我们在使用@v-model.trim看看有什么效果

 

这里的aaaaa前多了几个空格,再去查看控制台

对比情景二,v-model.trim的作用是将用户输入的前后的空格去掉

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/172394.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ESP32控制数码管实现数字叠加案例

经过了几个小时的接线和代码实现终于搞定了代码,贴出来大家参考下 import machine import time# 定义4个Led的引脚 led1 machine.Pin(5,machine.Pin.OUT) led2 machine.Pin(18,machine.Pin.OUT) led3 machine.Pin(19,machine.Pin.OUT) led4 machine.Pin(21,mac…

手摸手vue2+Element-ui整合Axios

后端WebAPI准备 跨域问题 为了保证浏览器的安全,不同源的客户端脚本在没有明确授权的情况下,不能读写对方资源,称为同源策略,同源策略是浏览器安全的基石 同源策略( Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能 所谓同源(即指在同一个域)就是两个页面具…

Idea常用的快捷键

快捷键 快速生成main()方法:psvm,回车 快速生成输出语句:sout,回车 ctrlz撤回,ctrlshiftz取消撤回 ctrlr替换 CtrlAltspace(内容提示,代码补全等) ctrl句号。最小化方法,恢复最小化方法。 …

【数据中台】开源项目(2)-Moonbox计算服务平台

Moonbox是一个DVtaaS(Data Virtualization as a Service)平台解决方案。 Moonbox基于数据虚拟化设计思想,致力于提供批量计算服务解决方案。Moonbox负责屏蔽底层数据源的物理和使用细节,为用户带来虚拟数据库般使用体验&#xff0…

Tabular特征选择基准

学术实验中的表格基准通常是一小组精心选择的特征。相比之下,工业界数据科学家通常会收集尽可能多的特征到他们的数据集中,甚至从现有的特征中设计新的特征。为了防止在后续的下游建模中过拟合,数据科学家通常使用自动特征选择方法来获得特征子集。Tabular特征选择的现有基准…

JavaFX开发调用AWT创建系统托盘MenuItem菜单中文乱码

打开系统托盘MenuItem只能显示英文字符和中文显示方框 解决办法: 打开Edit Configurations… 选择Mofidy options 勾选Add VM options 在VM optios中填入以下代码 -Dfile.encodingGBK

【MySQL | TCP】宝塔面板结合内网穿透实现公网远程访问

文章目录 前言1.Mysql服务安装2.创建数据库3.安装cpolar3.2 创建HTTP隧道4.远程连接5.固定TCP地址5.1 保留一个固定的公网TCP端口地址5.2 配置固定公网TCP端口地址 前言 宝塔面板的简易操作性,使得运维难度降低,简化了Linux命令行进行繁琐的配置&#x…

Oracle的安装及使用流程

Oracle的安装及使用流程 1.Win10安装Oracle10g 1.1 安装与测试 安装版本: OracleXEUniv10.2.1015.exe 步骤参考:oracleXe下载与安装 安装完成后测试是否正常 # 输入命令连接oracle conn sys as sysdba; # 无密码,直接按回车 # 测试连接的s…

我的第一次SACC之旅

今年有很多第一次,第一次作为“游客”参加DTCC(中国数据库大会),第一次作为讲师参与ACDU中国行(成都站),第一次参加OB年度发布会(包含DBA老友会),而这次是第一…

leetcode面试经典150题——32 串联所有单词的子串(中等+困难)

题目: 串联所有单词的子串(1中等) 描述: 给定两个字符串 s 和 p,找到 s 中所有 p 的 异位词 的子串,返回这些子串的起始索引。不考虑答案输出的顺序。 异位词 指由相同字母重排列形成的字符串(包括相同的字符串&…

【涂鸦T2-U】1、开发环境搭建

前言 本章介绍T2-U的开发环境搭建流程,以及一些遇到的问题。 一、资料 试用网址: 【新品体验】涂鸦 T2-U 开发板免费试用 涂鸦官网文档: 涂鸦 T2-U 开发板 T2-U 模组规格书 T2-U 开发板 淘宝(资料较全): 涂鸦智能 TuyaOS开发…

【C语言】字母转换大小写的三种方法

🦄个人主页:修修修也 🎏所属专栏:C语言 ⚙️操作环境:Visual Studio 2022 目录 方法一:库函数法 1.小写转换大写:toupper()函数 2.大写转换小写:tolower()函数 方法二:自定义函数加减32法 1.小写转换大…

Redis报错:JedisConnectionException: Could not get a resource from the pool

1、问题描述: redis.clients.jedis.exceptions.JedisConnectionException: Could not get a resource from the pool 2、简要分析: redis.clients.util.Pool.getResource会从JedisPool实例池中返回一个可用的redis连接。分析源码可知JedisPool 继承了 r…

BigDecimal的使用全面总结

BigDecimal BigDecimal可以表示任意大小,任意精度的有符号十进制数。所以不用怕精度问题,也不用怕大小问题,放心使用就行了。就是要注意的是,使用的时候有一些注意点。还有就是要注意避免创建的时候存在精度问题,尤其…

Spring全面详解(学习总结)

Spring FrameWork一、 前言二、IOC(控制反转)2.1 对于IOC的理解2.2如何使用IOC2.3配置文件的解读2.4IOC容器创建bean的两种方式2.5从IOC容器中取bean2.6bean的属性如果包含特殊字符 三、DI(依赖注入)四、Spring中的bean五、Spring中的继承六、Spring的依赖七、Spring读取外部资…

【咕咕送书 | 第六期】深入浅出阐述嵌入式虚拟机原理,实现“小而能”嵌入式虚拟机!

🎬 鸽芷咕:个人主页 🔥 个人专栏:《粉丝福利》 《linux深造日志》 ⛺️生活的理想,就是为了理想的生活! 文章目录 ⛳️ 写在前面参与规则引言一、为什么嵌入式系统需要虚拟化技术?1.1 专家推荐 二、本书适合谁&#x…

WiFi的CSMA/CA竞争窗口流程简述

1、若站点最初有数据要发送(不是发送不成功再进行重传的那种),且检测到信道空闲,在等待DIFS后,就发送整个数据帧。 2、否则,站点执行退避算法。一旦检测到信道忙,就冻结退避计时器。只要信道空…

Less 安装教程

文章目录 前言LESS的系统要求安装LESS例子输出Less编译css工具后言 前言 hello world欢迎来到前端的新世界 😜当前文章系列专栏:Sass和Less 🐱‍👓博主在前端领域还有很多知识和技术需要掌握,正在不断努力填补技术短板…

error LNK2038: 检测到“RuntimeLibrary”的不匹配项 解决方法

问题: 我们在使用Visual Studio编程的时候偶尔会遇到以下三种报错: error LNK2038: 检测到“RuntimeLibrary”的不匹配项: 值“MD_DynamicRelease”不匹配值“MDd_DynamicDebug” (引用的是release模式,但设置成debug模式了…

操作系统——进程管理

文章目录 进程和线程进程的概念进程和程序的区别PCB(进程控制块)程序是如何运行的进程的特征进程的状态和状态转换五态模型 进程控制进程状态装换为啥需要保证原子性如何实现原语的原子性? 进程控制相关原语进程创建进程终止进程的阻塞和唤醒进程的唤醒进程的切换 进…