uni-app textarea有概率在ios中焦点消失

发布于 1周前 作者 bupafengyu 来自 Uni-App

uni-app textarea有概率在ios中焦点消失

信息类别 详细信息
产品分类 uniapp/App
PC开发环境 Mac
PC系统版本 mac sonoma 14.6.1
HBuilderX 正式
HBuilderX版本 4.36
手机系统 iOS
手机系统版本 iOS 17
手机厂商 苹果
手机机型 iphone15
页面类型 vue
vue版本 vue3
打包方式 云端
项目创建方式 HBuilderX

操作步骤：

进入包含textarea的界面->点击输入框出现焦点（蓝色会闪的竖线）弹出微信输入法->进行输入->拼音打入’ceshi’还未在输入法中选择对应’测试’文本时输入框上的焦点消失(小概率出现)

预期结果：

焦点不会消失

实际结果：

不是每次焦点都会消失有概率会消失

bug描述：

苹果手机用户在使用 微信输入法 在textarea中进行输入会出现焦点输入框自动消失的情况但不是每次都出现（键盘弹出时会将textarea上移一小点），但我自己的手机iphone14相同系统的并没有测出这个问题


Harmonyos Next教程
3 回复

和打字快慢有关系吗，使用其他输入法有关系吗，因为没有提供复现工程，我无法复现你的问题。提供更多信息，有助于定位和解答你的问题。


后得知用户反馈说换搜狗输入法就没碰到该问题了，我也在想办法在复现中

在处理 uni-app 中 textarea 组件在 iOS 设备上出现焦点消失的问题时，这通常与一些特定的场景或系统行为有关，比如键盘弹出和收起、页面滚动、或者内存管理等。虽然无法直接给出一个“银弹”解决方案，但我们可以探讨一些常见的处理策略和代码示例，帮助你定位和解决问题。

1. 键盘事件监听与处理

确保在键盘弹出和收起时正确处理页面布局，避免因为页面调整导致 textarea 失去焦点。

export default {
  data() {
    return {
      // ...
    };
  },
  methods: {
    onKeyboardShow(e) {
      // 调整页面布局以适应键盘，比如增加页面底部padding
      this.$refs.container.style.paddingBottom = e.keyboardHeight + 'px';
    },
    onKeyboardHide() {
      // 恢复页面布局
      this.$refs.container.style.paddingBottom = '0';
    },
  },
  mounted() {
    // 监听键盘事件
    plus.keyEvent.addEventListener('keyboardDidShow', this.onKeyboardShow);
    plus.keyEvent.addEventListener('keyboardDidHide', this.onKeyboardHide);
  },
  beforeDestroy() {
    // 移除键盘事件监听
    plus.keyEvent.removeEventListener('keyboardDidShow', this.onKeyboardShow);
    plus.keyEvent.removeEventListener('keyboardDidHide', this.onKeyboardHide);
  },
};

2. 使用 v-model 绑定数据

确保 textarea 的值是双向绑定的，这有助于在数据更新时保持焦点。

<template>
  <view>
    <textarea v-model="inputText" ref="textarea" auto-focus></textarea>
  </view>
</template>

<script>
export default {
  data() {
    return {
      inputText: '',
    };
  },
};
</script>

3. 延迟恢复焦点

在某些情况下，可以在键盘收起后使用 setTimeout 延迟恢复焦点。

onKeyboardHide() {
  // 恢复页面布局后延迟恢复焦点
  setTimeout(() => {
    this.$refs.textarea.focus();
  }, 300); // 根据实际情况调整延迟时间
}

4. 检查系统级问题

确保你的 iOS 设备或模拟器运行的是最新版本的操作系统，因为一些已知的键盘或焦点问题与特定版本的 iOS 相关。

结论

由于问题的复杂性，上述方法可能需要结合使用或根据具体情况调整。在实际开发中，建议详细记录复现步骤和场景，以便更精确地定位问题。同时，关注 uni-app 社区和官方文档，了解是否有相关的更新或补丁。

回到顶部