uniapp 如何收起键盘的实现方法

在uniapp开发中，点击输入框外的区域时如何自动收起键盘？目前测试发现键盘不会自动隐藏，必须手动点击返回键才能关闭。请问有没有通用的实现方法，比如通过监听点击事件或者调用API来强制收起键盘？希望能在H5和APP端都兼容的方案。

2 回复

在uniapp中收起键盘，可以使用uni.hideKeyboard()方法。适用于输入框失去焦点或页面跳转时自动隐藏键盘。


在 UniApp 中收起键盘，可以通过以下方法实现：

1. 使用 uni.hideKeyboard()

这是最直接的方法，调用后会立即收起当前页面的键盘。

uni.hideKeyboard();

2. 通过失去输入框焦点收起键盘

在输入框上绑定 blur 事件，当输入框失去焦点时键盘会自动收起。

<input @blur="onBlur" focus />

methods: {
  onBlur() {
    // 输入框失去焦点，键盘自动收起
  }
}

3. 点击页面空白区域收起键盘

通过监听页面触摸事件，使输入框失去焦点：

<view @tap="hideKeyboard">
  <input focus />
</view>

methods: {
  hideKeyboard() {
    uni.hideKeyboard();
  }
}

注意事项：

  • 确保在需要收起键盘的场景调用上述方法，例如提交表单、切换页面时。
  • 在部分安卓机型上，键盘收起可能有轻微延迟，属正常现象。

根据实际需求选择合适的方法即可。

回到顶部