uview1.0部分机型u-input组件禁用后无法触发click事件

最近,线上的一个 App 收到用户反馈,输入框禁用状态下点击无法拉起模态框。找了一下身边可用机型进行了测试,起初所有机型都没有复现这个问题,突然有一天 Redmi K30S Ultra 出现了异常,点击输入框无法触发点击事件,只有输入框右侧的图标可以触发点击事件。
在这里插入图片描述
接着看了一下 uview 的源码,u-input 组件在 input 组件外套了盒子,外面的盒子确实绑定了 click 事件,我们处理的实际上是 u-input 组件的点击事件而不是 input 组件的点击事件。

<template><viewclass="u-input":class="{'u-input--border': border,'u-input--error': validateState}":style="{padding: `0 ${border ? 20 : 0}rpx`,borderColor: borderColor,textAlign: inputAlign}"@tap.stop="inputClick">……<view class="u-input__right-icon u-flex"><view class="u-input__right-icon__clear u-input__right-icon__item" @tap="onClear" v-if="clearable && value != '' && focused"><u-icon size="32" name="close-circle-fill" color="#c0c4cc"/></view><view class="u-input__right-icon__clear u-input__right-icon__item" v-if="passwordIcon && type == 'password'"><u-icon size="32" :name="!showPassword ? 'eye' : 'eye-fill'" color="#c0c4cc" @click="showPassword = !showPassword"/></view><view class="u-input__right-icon--select u-input__right-icon__item" v-if="type == 'select'" :class="{'u-input__right-icon--select--reverse': selectOpen}"><u-icon name="arrow-down-fill" size="26" color="#c0c4cc"></u-icon></view></view></view>
</template><script>
export default {name: 'u-input',……methods: {……inputClick() {this.$emit('click');}}
};
</script>

最终定位到问题是 u-inputclick 事件在内部的 input 组件禁用时,无法正常触发。目前,只是在部分 Android 机型上有这个问题。

所以,在处理类似的交互时可以选择如下方案进行修改:

  • 在禁用状态下,在 u-input 组件右侧添加 icon ,通过 icon 的点击事件拉起模态框
  • u-input 组件顶部添加一个盒子,触发盒子的点击事件拉起模态框

注:input 组件是 uniapp 提供的内置表单组件,是没有点击事件的

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

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

相关文章

Oracle 数据库相关操作记录

1 数据库操作&#xff1a; 1.1 --调用存储过程&#xff1a; DECLARE P_DATA_DATE VARCHAR2(32767);--定义输入参数 P_O_RESULT VARCHAR2(32767); BEGIN P_DATA_DATE : 20220320;--输入日期 P_O_RESULT : NULL; TPS.PR_TP_RBC34_TMP ( P_DATA_DATE, P_O_RESULT );--输…

n皇后问题,不用递归

注释如下&#xff1a; class Solution:def totalNQueens(self, n: int) -> int:if n < 1: # 如果 n 小于 1&#xff0c;直接返回 0return 0count 0 # 初始化解的个数为 0stack [(0, set(), set(), set())] # 初始化一个栈&#xff0c;元素为当前处理的行数、已经放…

专业安卓实时投屏软件:极限投屏(QtScrcpy作者开发)使用说明

基本介绍 极限投屏是一款批量投屏管理安卓设备的软件&#xff0c;是QtScrcpy作者基于QtScrcpyCore开发&#xff0c;主要功能有&#xff1a; 设备投屏&控制&#xff1a;单个控制、批量控制分组管理wifi投屏adb shell快捷指令文件传输、apk安装 更多功能还在持续更新。 极…

Locust负载测试工具实操

本中介绍如何使用Locust为开发的服务/网站执行负载测试。 Locust 是一个开源负载测试工具&#xff0c;可以通过 Python 代码构造来定义用户行为&#xff0c;避免混乱的 UI 和臃肿的 XML 配置。 步骤 设置Locust。 在简单的 HTTP 服务上模拟基本负载测试。 准备条件 Python…

【限时免费】20天拿下华为OD笔试之 【单调栈】2023B-阿里巴巴找黄金宝箱(4)【欧弟算法】全网注释最详细分类最全的华为OD真题题解

【单调栈】2023B-阿里巴巴找黄金宝箱(4) 题目描述与示例 一贫如洗的椎夫阿里巴巴在去砍柴的路上&#xff0c;无意中发现了强盗集团的藏宝地&#xff0c;藏宝地有编号从 0-N 的子&#xff0c;每个箱子上面有一人数字&#xff0c;箱子排列成一个环&#xff0c;编号最大的箱子的…

远程监控高并发高吞吐java进程

文章目录 背景工具jconsole和jvisualvm 压测实战以太坊Java程序监控1.使用jconsole监控2.使用jvisualvm监控 问题分析堆内存使用异常通过调整内存策略来应对&#xff1a; 交易虚增问题 背景 作为使用java技术栈的金融类公司&#xff0c;确保Java程序在生产环境中的稳定性和性能…

2023年【北京市安全员-B证】考试试卷及北京市安全员-B证模拟考试题

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 北京市安全员-B证考试试卷考前必练&#xff01;安全生产模拟考试一点通每个月更新北京市安全员-B证模拟考试题题目及答案&#xff01;多做几遍&#xff0c;其实通过北京市安全员-B证在线考试很简单。 1、【多选题】《…

JVM(Java Virtual Machine)垃圾收集算法篇

前言 本文参考《深入理解Java虚拟机》&#xff0c;主要介绍GC相关的算法&#xff0c;引用计数法、可达性分析算法、垃圾收集算法&#xff08;分代收集理论&#xff0c;标记-清除/整理/复制&#xff09; 本系列其他文章链接&#xff1a; JVM&#xff08;Java Virtual Machine&…

leetcode 2525 根据规则将箱子分类 c++ pyhton java c题解

leetcode 2525 根据规则将箱子分类 题目 给你四个整数 length &#xff0c;width &#xff0c;height 和 mass &#xff0c;分别表示一个箱子的三个维度和质量&#xff0c;请你返回一个表示箱子 类别 的字符串。 如果满足以下条件&#xff0c;那么箱子是 “Bulky” 的&#…

macrodata数据集在Python统计建模和计量经济学中的应用

目录 一、数据介绍二、应用三、statsmodels 统计模块四、使用 statsmodels 统计模块分析 macrodata.csv 数据集参考 一、数据介绍 macrodata.csv是一个示例数据集&#xff0c;通常用于统计分析和计量经济学中的教育和训练目的。这个数据集通常包括以下列&#xff1a; year&am…

深度学习八股文: 模型训练全过程及各阶段的原因

深度学习模型的训练全过程通常包括以下步骤&#xff1a; 数据准备&#xff1a; 首先&#xff0c;需要准备用于训练的数据集。数据集应包含输入特征&#xff08;通常是数值或图像数据&#xff09;和相应的目标标签。数据通常需要被分为训练集、验证集和测试集&#xff0c;以便评…

STM32使用WWDG窗口看门狗

1 WWDG 介绍 1.1 WWDG 简介 窗口看门狗 WWDG 其实和独立看门狗类似&#xff0c;它是一个 7 位递减计数器不断的往下递减计数&#xff0c; 当减到一个固定值 0X40 时还不喂狗的话&#xff0c;产生一个 MCU 复位&#xff0c;这个值叫窗口的下限&#xff0c;是固定的值&#xf…

支持语音与视频即时通讯项目杂记(二)

目录 概念&#xff1a; 视频帧&#xff08;Video Frame&#xff09;是组成视频的基本单元。它可以被视为一幅静止的图像&#xff0c;它在一定的时间间隔内连续播放&#xff0c;从而形成了流畅的视频。 Changes to Qt Multimedia New features in Qt 6 Removed features C…

居民小区电动汽车有序充电策略研究

摘 要&#xff1a;针对电动汽车在居民小区无序充电对电网系统产生严重隐患及充电间时过长问题&#xff0c;提出一种采用延迟充电的电动汽车有序充电控制策略&#xff0c;并在分析国内外电动汽车有序充电的研究现状后&#xff0c;设计了居民小区电动汽车有序充电策略的总体框架。…

android利用FFmpeg进行视频转换

大致思路&#xff1a;首先安装FFmpeg库到windows电脑上&#xff0c;先测试命令行工具是否可以使用&#xff08;需要先配置环境&#xff09;&#xff0c;之后再集成到android程序中。 一些命令&#xff1a; 转化为流文件&#xff1a; ffmpeg -i input.mp4 -codec copy -bsf:v …

JIT耗时优化

优质博文&#xff1a;IT-BLOG-CN 一、背景 业务流量突增&#xff0c;机器直接接入大量流量QPS2000&#xff0c;JIT和GC会消耗太多CPU资源&#xff0c;导致1-2分钟时间内的请求超时导致异常&#xff0c;因此采用流量预热的方式&#xff0c;让机器逐步接入流量&#xff0c;需要预…

2023-10-20 游戏开发-cocos旧版本2.0.6-下载地址-记录

官方下载地址: Cocos Creator 下载 - 轻量高效的开发引擎 Tags cocos/cocos-engine GitHub cocos creater 旧版本: Tool/Package/REAMDE.md adofsauron/CocosCreatorFAQ - Gitee.com v2.0.6版本: Mac版&#xff1a;http://cocos2d-x.org/filedown/CocosStudioForMac-v2.0.…

vscode类似GitHub Copilot的插件推荐

由于GitHub Copilot前段时间学生认证的账号掉了很多&#xff0c;某宝激活也是价格翻了几倍&#xff0c;而却&#xff0c;拿来用一天就掉线&#xff0c;可以试试同类免费的插件哦。 例如&#xff1a;TabNine&#xff0c;下载插件后&#xff0c;他会提示你登录&#xff0c;直接登…

spring6-国际化:i18n | 数据校验:Validation

文章目录 1、国际化&#xff1a;i18n1.1、i18n概述1.2、Java国际化1.3、Spring6国际化1.3.1、MessageSource接口1.3.2、使用Spring6国际化 2、数据校验&#xff1a;Validation2.1、Spring Validation概述2.2、实验一&#xff1a;通过Validator接口实现2.3、实验二&#xff1a;B…

关于计算机找不到vcomp140.dll无法继续执行怎么修复

在计算机使用过程中&#xff0c;我们可能会遇到各种问题&#xff0c;其中之一就是vcomp140.dll文件丢失。vcomp140.dll是一个动态链接库文件&#xff0c;它通常用于支持软件运行和系统功能。当这个文件丢失时&#xff0c;可能会导致程序无法正常运行&#xff0c;甚至系统出现错…