uniapp编译多端项目App、小程序,input框键盘输入后

news2024/11/22 12:04:47

项目场景:

uniapp编译后的小程序端,app端 在一个输入框 输入消息后,点击键盘上的操作按钮之后键盘不被收起,点击其他发送按钮时,键盘也不被收起。


问题描述

在编译后的app上普通的事件绑定,@tap,@click在发送事件上,每次点击发送后,input框就失焦了,键盘就被收起了。


解决方案:

因为uniapp有编译成app和小程序,就有两端的解决方案,app和小程序不兼容

小程序端:

需要设置:hold-keyboard,confirm-hold 这两个属性为true,hold-keyboard只兼容小程序。

文档:input | uni-app官网

<input
 :confirm-hold="true"
 :hold-keyboard="true"
 ref="inputEle"
class="TUI-message-input-area"
:adjust-position="false"
cursor-spacing="20"
v-model="inputText"
@input="onInputValueChange"
maxlength="140"
type="text"
placeholder-class="input-placeholder"
placeholder="说点什么呢~"
@focus="inputBindFocus"
	@blur="inputBindBlur"
/>

 app端:

需要把发送按钮的@tap事件改为@touchend.prevent绑定,confirm-hold 这两个属性为true

<input
:confirm-hold="true"
ref="inputEle"
class="TUI-message-input-area"
:adjust-position="true"
cursor-spacing="20"
v-model="inputText"
@input="onInputValueChange"
maxlength="140"
type="text"
placeholder-class="input-placeholder"
placeholder="说点什么呢~"
/>
<view  class="TUI-sendMessage-btn" @touchend.prevent="sendTextMessage">发送</view>

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

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

相关文章

高并发编程

一台64G内存的服务器QPS可以达到9W&#xff0c;TPS&#xff08;事务&#xff09;可以达到5K&#xff0c;每个TPS大约包含18个QPS.只读的话QPS可以达到30~40万.阿里云有相关测试工具、测试方法、测试结果。 1、volatile 保证可见性&#xff0c;禁止指令重排&#xff0c;避免多线…

论文 | PROMPTAGATOR : FEW-SHOT DENSE RETRIEVAL FROM 8 EXAMPLES

1. 背景信息 在信息检索领域&#xff0c;传统的方法往往依赖于大量的标注数据来训练模型&#xff0c;以便在各种任务中表现良好。然而&#xff0c;许多实际应用中的监督数据是有限的&#xff0c;尤其是在不同的检索任务中。最近的研究开始关注如何从一个拥有丰富监督数据的任务…

群控系统服务端开发模式-应用开发-上传工厂开发

现在的文件、图片等上传基本都在使用oss存储。而现在常用的oss存储有阿里云、腾讯云、七牛云、华为云等&#xff0c;但是用的最多的还是前三种。而我主要封装的是本地存储、阿里云存储、腾讯云存储、七牛云存储。废话不多说&#xff0c;直接上传设计图及说明&#xff0c;就一目…

STM32之串口字库更新

1.串口通讯介绍 串口通讯&#xff08;Serial Communications&#xff09;是一种通过串口进行数据传输的通讯方式&#xff0c;通过串行口每次传输一个字节的数据&#xff0c;按照约定的协议进行数据的传输和接收。串口通讯的原理是利用串行口的发送和接收线路&#xff0c;将需要…

立刻解决 gcc: error: unrecognized argument in option ‘-mabi=aapcs-linux’

unrecognized argument in option ‘-mabiaapcs-linux’ Linux 主线支持的硬件较少&#xff0c;一般是第三方开源&#xff08; Linaro/Yocto &#xff09;或者硬件厂商提供定制的嵌入式 Linux 如果确认主线支持自己的硬件&#xff0c;可以从 https://www.kernel.org/ 获取指定…

法律智能助手:开源NLP系统助力法律文件高效审查与检索

一、系统概述 思通数科AI平台是一款融合了自然语言处理和多标签分类技术的开源智能文档分类工具&#xff0c;特别适用于法律行业。平台采用深度学习的BERT模型来进行特征提取与关系抽取&#xff0c;实现了精准的文档分类和检索。用户可以在线训练和标注数据&#xff0c;使系统…

ChatGPT新体验:AI搜索功能与订阅支付指南

就在凌晨&#xff0c;在ChatGPT迎来两周岁生日之际&#xff0c;OpenAI重磅发布了ChatGPT的全新人工智能搜索体验。 期待已久的时刻终于到来&#xff0c; ChatGPT正式转型成为一款革命性的AI搜索引擎! 先来看看ChatGPT搜索&#xff1a;这次不是简单的加个搜索框&#xff0c;而…

【零售和消费品&家居用品】家庭门窗开闭状态安全监控系统源码&数据集全套:改进yolo11-DCNV2

改进yolo11-GhostDynamicConv等200全套创新点大全&#xff1a;家庭门窗开闭状态安全监控系统源码&#xff06;数据集全套 1.图片效果展示 项目来源 人工智能促进会 2024.11.01 注意&#xff1a;由于项目一直在更新迭代&#xff0c;上面“1.图片效果展示”和“2.视频效果展示”…

合并区间 leetcode56

合并区间leetcode 目录一、题目二、踩坑过程三、上官方解答四、含泪体会彩蛋 目录 一、题目 二、踩坑过程 一开始想使用一个数组来标记区间&#xff0c;但是仔细想不好实现&#xff0c;单纯把区间里出现的设置为1&#xff0c;不好体现重叠的概念&#xff0c;如果使用三种状态…

【Linux】- 权限

目录 一、Linux常用热键 &#xff08;1&#xff09;、history&#xff1a; &#xff08;2&#xff09;、单击tab键 / 双击tab键 &#xff08;3&#xff09;、快捷键ctrl c 和 ctrl d 二、关机指令 shutdown 三、window与linux互传文件 四、不同linux系统间互传文件 …

C++(友元、异常机制、静态成员、单例模式)

友元 友元可以访问与其好友关系的类中的私有成员&#xff0c;使用friend关键字进行修饰。&#xff08;友元破坏了类的封装性&#xff09;。 特点 &#xff08;1&#xff09;友元是单向的 &#xff08;2&#xff09;友元不能传递 &#xff08;3&#xff09;友元…

Halcon区域分割之分水岭分割法

现实中我们见到过有山有湖的景象&#xff0c;那么一定是水绕山、山围水的情形。当然可在需要的时候人工构筑分水岭&#xff0c;以防集水盆之间的互相穿透。而区分高山与水的界线以及湖与湖之间的间隔&#xff0c;就是分水岭。 分水岭分割法是一种基于拓扑理论的数学形态…

【python】OpenCV—Tracking(10.4)—Centroid

文章目录 1、任务描述2、人脸检测模型3、完整代码4、结果展示5、涉及到的库函数6、参考 1、任务描述 基于质心实现多目标&#xff08;以人脸为例&#xff09;跟踪 人脸检测采用深度学习的方法 核心步骤&#xff1a; 步骤#1&#xff1a;接受边界框坐标并计算质心 步骤#2&…

使用Jupyter Notebook进行数据科学项目

&#x1f493; 博客主页&#xff1a;瑕疵的CSDN主页 &#x1f4dd; Gitee主页&#xff1a;瑕疵的gitee主页 ⏩ 文章专栏&#xff1a;《热点资讯》 使用Jupyter Notebook进行数据科学项目 Jupyter Notebook 简介 安装 Jupyter Notebook 创建和管理 Notebook 编写和运行代码 示例…

MR30分布式IO:石化行业的智能化革新

在浩瀚的工业领域中&#xff0c;石化行业如同一座巨大的化工厂&#xff0c;将自然界的原始资源转化为人们日常生活中不可或缺的各种产品。然而&#xff0c;随着生产规模的扩大和工艺复杂度的提升&#xff0c;石化行业面临着前所未有的挑战&#xff1a;如何在保证生产效率的同时…

Android 使用ninja加速编译的方法

ninja的简介 随着Android版本的更迭,makefile体系逐渐增多,导致make单编模块的时间越来越长,每次都需要半个小时甚至更长时间,其原因为每次make都会重新加载所有mk文件,再生成ninja编译,此完整过程十分耗时,实际编译代码仅占其中的一小部分。 因此我们可以使用google提…

要在微信小程序中让一个 `view` 元素内部的文字水平垂直居中,可以使用 Flexbox 布局

文章目录 主要特点&#xff1a;基本用法&#xff1a;常用属性&#xff1a; 要在微信小程序中让一个 view 元素内部的文字水平垂直居中&#xff0c;可以使用 Flexbox 布局。以下是如何设置样式的示例&#xff1a; .scan-button {display: flex; /* 启用 Flexbox 布局 */justify…

网关如何传递信息给微服务

前情回顾 上篇我们已经完成了网关对所有微服务请求的拦截以及JWT的登录校验。 客户端和微服务之间的桥梁--网关&#xff08;身份校验&#xff09;https://mp.csdn.net/mp_blog/creation/editor/143425484 问题引入 现在的问题是在一些微服务业务中&#xff0c;需要用到用户…

ubuntu 24.04中安装 Easyconnect,并解决版本与服务器不匹配问题

下载安装包 下载地址 https://software.openkylin.top/openkylin/yangtze/pool/all/ 页面搜索 easyconnect 选择 easyconnect_7.6.7.3.0_amd64.deb安装 sudo dpkg --install easyconnect_7.6.7.3.0_amd64.deb卸载 sudo dpkg --remove easyconnect出现的问题 安装以后第…

Learn QOpenGL 读取obj模型

/* ** File name: OpenGLModelWidget.h ** Author: ** Date: 2024-10-31 ** Brief: 读取模型文件并渲染的OpenGL控件 ** Copyright (C) 1392019713qq.com All rights reserved. */#ifndef OpenGLModelWidget_H #define OpenGLModelWidget_H#include…