按“enter回车”或者“失去焦点”实现输入框内容的修改

2023-11-03

最近做一个简单的todo应用时,有这样一个场景:某个输入框中点击回车(@keyup.enter)和失去焦点(@blue)这两个操作均可以触发修改数据的接口。然而每次按回车后又会触发@blur,接口会调用两次。但是又的确得加入这两个操作,仅适用一个操作会显得不友好。
因此考虑对@keyup.enter处理,回车触发失去焦点事件即可
如下:

 <input
      @keyup.enter="$event.target.blur()"
      @blur="
        (e) => {
          editInput(e, todo);
        }
      "
    />
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

按“enter回车”或者“失去焦点”实现输入框内容的修改 的相关文章

  • jQuery:通过子项进行动画、连续循环

    接近但还没有完全实现 我想让第一个子 div 显示几秒钟 向下滑动 通过定位 并淡出视图 然后下一个子 div 向上滑动并淡入视图 连续重复 在显示最后一个子项后循环返回 看起来我已经让循环正常工作了 尽管计数似乎将子 div 堆叠在一起
  • 如何根据普通 JavaScript 中的属性对对象数组进行分组

    你怎么groupBy基于普通 JavaScript 中特定属性的对象数组 例如给出的 const products category Sporting Goods price 49 99 stocked true name Football
  • MobileSafari 的正确触摸按钮行为

    MobileSafari 通常具有不正确的 HTML 按钮行为 不正确的含义 不像 iOS 原生按钮 正确的按钮行为如下 用户触摸按钮 按钮突出显示 用户将手指拖出按钮 按钮变暗 用户将手指拖回按钮 按钮突出显示 用户将手指拖出按钮并释放
  • 替换文本区域的文字

    我制作了一个 javascript 函数来将文本区域中的某些单词替换为其他单词 但它不起作用 我做了这个 function wordCheck var text document getElementById eC value var ne
  • 在 JavaScript 中使用 Array.map 删除元素

    我想使用以下方法过滤一系列项目map 功能 这是一个代码片段 var filteredItems items map function item if some condition return item 问题是过滤掉的项目仍然使用数组中的
  • javascript 可以从父页面访问 iframe 元素吗?

    我的页面上有 iframe iframe 和父页面位于不同的域中 父页面上的 javascript 代码可以访问此 iframe 内的元素吗 如果页面来自不同的域 则不应该这样做 浏览器安全沙箱应该阻止这种类型的访问 当两个页面来自不同的时
  • Bootstrap 页脚不在底部

    我试图强制我的页脚位于网站底部 我不希望它在滚动时粘住 只是在向下滚动网页时出现在底部 目前 网页显示时页脚位于内容下方 我添加了这样的代码bottom 0 并发现它粘住了并且不适合我的网站 我还添加了这样的代码html body heig
  • 在 Javascript 中隐藏按钮

    在我最新的程序中 有一个按钮 单击时会显示一些输入弹出框 这些框消失后 如何隐藏按钮 You can set its visibility财产 http www w3schools com cssref pr class visibilit
  • 通过标记或JS强制下载

    假设我在 CDN 来自 Rackspace 的云文件 上有一个文件 以及一个包含该文件链接的静态 html 页面 有什么方法可以强制下载此文件 以防止它在浏览器中打开 例如 mp3 我们可以让我们的服务器读取该文件并将相应的标头设置为 he
  • 设置三个输入数字的最大值

    我有三个输入数字
  • 将jQueryUI datepicker附加到div(显示位置错误)

    我在输入上使用 jQueryUI datepicker 默认情况下 jQueryUI 会附加 ui datepicker div to the body该文件的 有问题的输入位于屏幕上的 弹出 div 中 这意味着该 div 之外的任何点击
  • 如何在 Google 地图上旋转叠加图像?

    我正在尝试将一系列叠加层放置到 Google 地图上 我正在跟随地面覆盖层的示例代码 https developers google com maps documentation javascript examples groundover
  • 在 Bootstrap 选择器上使用 jQuery 取消选择选项

    我对一些 UI 元素使用 Bootstrap SelectPicker 它允许用户选择多个选项并将其呈现在段落标签中的屏幕上 他们还应该能够删除选定的选项 这是我的代码 用于将选定的选项渲染到屏幕上 以便每个选项旁边都会显示一个 X 单击它
  • 提交外部有 INPUT 的表单,并修改值后

    我有一个form 有几个
  • Google Maps API - 调整大小会生成空白区域

    我正在研究一个看起来非常简单的功能 但却引起了一些头痛 我使用 GIS 并将其与 Google 地图集成 其中一位客户要求能够打开一个仅显示地图的单独弹出窗口 打开窗口不是问题 但当我尝试扩展包含地图的 IFrame 的宽度时 为了适应窗口
  • Javascript - 通过键获取特定 JSON 数组元素内的属性值

    我有一个像这样的 JSON 结构 map key1 valueA1 key2 valueA2 key3 valueA3 key1 valueB1 key2 valueB2 key3 valueB3 key1 valueC1 key2 val
  • 如何拦截javascript中innerHTML的变化?

    我需要拦截网页内单元格内容的任何更改 以下代码显示 addEventListener 不起作用 function modifyText alert var el document getElementById mycell el inner
  • 如何从索引文件迭代多个导入的模块

    我有一个名为Polygons我在那里创建了一个index jsfile 以导出目录中的所有文件 它看起来像这样 export default as europe from europe export default as northAmer
  • 如何使用 jQuery 解析 JavaScript 对象

    jQuery JavaScript 中用于解析 JSON 对象并返回键 值对的 foreach 等效项是什么 JSON 对象 是什么意思 JSON 是一种用于序列化对象的文本格式 如果要循环访问通过反序列化 JSON 字符串获得的对象中的属
  • 如何将国家/地区代码与电话号码分开?

    我的数据库中有很多电话号码 例如 1 123 456 7890 我要做的是将国家 地区拨号代码 在本例中为美国 加拿大的 1 与电话号码分开 我尝试创建所有国家 地区的 JSON 列表 并在加载页面时将电话号码和国家 地区代码分开 它工作正

随机推荐

  • spotbug扫描java代码问题

    spotbug检查提示 Random object created and used only once 代码 for int i 0 i lt 1 i sb append numberArr r nextInt numberArr len
  • 正则表达式的匹配规则

    字面量字符和元字符 大部分字符在正则表达式中 就是字面的含义 比如 a 匹配 a b 匹配b 这种只表示它字面量含义的被称为字面量字符 除了字面量 还有一些字符有特殊含义 不代表字面意思 被称为元字符 1 点字符 点字符匹配除回车 r 换行
  • WSL[06] 安装gnome 和 systemD的冲突@Errors were encountered while processing: /var/cache/apt/archives/...

    前言 Ubuntu的snap方法和APT的安装方法 似有些冲突问题 这个问题也许是这个引起的 卡在snap Firefox不会动了 似乎比较常见 可以实验如下解决方法 修复 Ubuntu 22 04起仅提供snap版firefox 知乎 z
  • Vben-admin源码学习(一)——客户端数据持久化

    一 碎碎念 总觉得自己做项目ts写得很别扭 很多用法都不会也不知从何学起 对于项目结构也是似懂非懂 于是开始看Vben源码 确实看得头皮发麻 但是没办法 还是得一步一步来 希望能坚持看完 刚理解了本地数据存储的封装 确实有学到一些新东西 记
  • MySql 常用命令

    MySql中一些常用的命令 备忘 1 Data Control Language 2 Data Definition Language 3 Data Manipulation Language 4 Transaction Control L
  • STM32F407的串口接收不定长数据两种方式HAL库

    文章目录 概要 整体架构流程 不用DMA的方式 使用DMA方式 小结 概要 STM32的串口接收不定长数据 最近在看超子说物联网 感觉太麻烦了不适合直接上手 然后我自己总结了两种方法 1 不利用DMA 2 利用DMA方式 整体架构流程 这个
  • GCC:dereferencing type-punned pointer will break strict-aliasing rules

    linux 编译C 出现了dereferencing type punned pointer will break strict aliasing rules 即 取消对类型指针的引用将打破严格的别名规则 原因 高优化级别下 由于不同类型指
  • c# 跨平台 Avalonia 学习笔记 (一) 搭建和图片引用

    Avalonia 读 阿瓦隆尼亚 官网的资料是 官网 安装Avalonia 打开vs2022 选择管理拓展 点击下载 安装 2 安装完成后 重启VS2022 我们可以看到1和2 其中1是使用MVVM模式开发 2是普通模式开发 我们选择2 建
  • 2022年了,该学C++还是Java?

    最近好多朋友私信我 C 好不好学 学C 好还是Java好 我的回答是 C 不好学 但你觉得C 不好学的话 Java也不好学 因为C 难是难在语言本身 java难是难在各种框架和库 C 学习进阶比较陡 对新手不友好 新手写起来代码 心智负担很
  • THREEJS在场景图上动态标识一些文字方法二(文字精灵sprite)

    threejs文字精灵sprite的实现 1 手动添加文字精灵 2 通过json动态获取文字精灵 并进行交互 3 point模型只表示位置 4 CircleGeometry实现 5 3 PlaneGeometry表示 方法 使用sprite
  • Java基础17--重写与重载

    Java基础17 重写与重载 文章目录 Java基础17 重写与重载 重写 Override 方法的重写规则 Super 关键字的使用 重载 Overload 重写与重载之间的区别 总结 重写 Override 重写是子类对父类的允许访问的
  • python学习笔记(一)---第一个python程序

    1 Windows CMD命令 cd 文件夹名称 进入指定文件夹 dir 查看当前目录下的文件 2 python的运行 在命令行敲入pthon 进入python交互模式 交互模式下的提示符是 gt gt gt 然后就可以敲代码 如print
  • Qt实战之实现图片浏览系统

    引言 本系统支持 自动播放 左右拖动切换 点击列表切换 点击按钮切换 是一个标准的图像浏览软件 Windows 图片浏览器 可以查看当前文件夹下的图片 往上翻 往下翻并且自动播放 此系统增加一个列表 本文福利 莬费领取Qt开发学习资料包 技
  • 期货开户控制风险才能获取更大的利润

    1 其实成为一个优秀的投资者其实并不是很难 不信吗 只要你能树立在市场上生存的正确原理 并坚持恰当地运用它 不要去想着市场会涨还是会跌 就像不要试图预测白云明天的形状和今天有何不同 你只需看到乌云浓重时带一把雨伞出门就行了 金融市场上的语言
  • 如何零基础创建自己的微信小程序

    目录 创建微信小程序 步骤 1 打开浏览器搜索微信公众平台 2 一般是先要注册的 当然已经有的就不需要了 3 选择注册的类型 关于 小程序怎么开发自己的小程序 这个不少人关注的问题 小编针对性的给出详细教程 一共22个步骤 1 进入公众平台
  • shell脚本 dos格式转unix

    bin shdostype dosIFS echo en n b function iterate dir for file in 1 doif f file thentypename file file grep q CRLF echo
  • Java将字符串反转的几种方式

    一 使用 StringBuilder 或 StringBuffer 的 reverse 方法 他们的本质都是调用了它们的父类 AbstractStringBuilder 的 reverse 方法实现的 需要JDK1 8 使用StringBu
  • sqli-labs进阶篇 32关~38关

    本文章主要讲述sqli labs靶场第32关到38关的通关心得 从三方面讲述如何通关 分别是注入点判断 源码分析 注入过程 文章若有不恰当之处 望指出 第三十二关 判断注入点 注入单引号和双引号时 都有转移字符出现 说明这里不能直接用单 双
  • 你可以做到

    我经常听到有些人说 好难呀 我做不到 我想说 你只是不知道你能 最近很累 但是我实在是不想再后悔了 这两个月经历的一些事 打醒了我这只井底之蛙 为什么他们有 而我没有 为什么他们能做到 我却没有做到 最重要的是我一点不比他们差 好累啊 但是
  • 按“enter回车”或者“失去焦点”实现输入框内容的修改

    最近做一个简单的todo应用时 有这样一个场景 某个输入框中点击回车 keyup enter 和失去焦点 blue 这两个操作均可以触发修改数据的接口 然而每次按回车后又会触发 blur 接口会调用两次 但是又的确得加入这两个操作 仅适用一