uni-app textarea在App端引起的一系列异常

uni-app textarea在App端引起的一系列异常

测试过的手机

  • iPhone XS
  • 红米K30 5G

示例代码：

<textarea v-model="input" :show-confirm-bar="false" class="" :auto-height="false" :adjust-position="true" placeholder="我是textarea组件的placeholder~" />  
<input type="text" value="" placeholder="我是input组件的placeholder~" />

操作步骤：

  • 复现卡顿: iOS14版本中测试textarea组件即可
  • 复习socket断线: 全局创建一个 WebSocket 连接,监听close及error事件,测试textarea组件

预期结果：

  • 正常

实际结果：

  • 异常

bug描述：

textarea组件在iOS14版本测试中,show-confirm-bar参数可能引起点击组件获取焦点及键盘弹出卡顿,同input组件无此异常
举例: 全局创建一个 WebSocket 连接。当在iOS14版本测试中点击组件,组件卡顿并发socket断线
在Android10中无卡顿,但同样会造成socket断线.

开发环境 版本号 项目创建方式
Mac 10.15.6 HBuilderX
3.2.10

更多关于uni-app textarea在App端引起的一系列异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app textarea在App端引起的一系列异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html


根据你描述的问题，这确实是uni-app在App端textarea组件的一个已知性能问题，尤其在iOS设备上表现更为明显。

问题分析：

  1. iOS卡顿问题：show-confirm-bar参数在iOS14+系统中与系统键盘的交互存在兼容性问题。当设置为false时，系统需要重新计算布局，导致焦点获取和键盘弹出出现明显延迟。建议在iOS端暂时保留默认的确认栏（即不设置或设为true），这能显著改善体验。

  2. WebSocket断连问题：这是更关键的问题。textarea组件在获取焦点时，会触发WebView的重绘或重构，这个过程可能意外中断WebSocket连接。这属于底层渲染机制的问题，在Android和iOS上均可能出现。

临时解决方案：

  • 针对卡顿：通过条件编译区分平台处理：
<textarea 
  v-model="input" 
  :show-confirm-bar="platform === 'ios' ? true : false"
  :adjust-position="false"
/>
回到顶部