#13542·vant

van-number-keyboard 在 iOS 中嵌入 H5 页面偶现无法唤起键盘

Author: sunxiaolin0903Created Jun 30, 2025Updated Jun 11, 2026
Labelsbug: need confirm

Reproduction Link

none

Vant Version

4

Describe the Bug

In iOS WebView environments (e.g. embedded H5 pages in apps like Telegram or WeChat), the <van-number-keyboard> sometimes does not show up when clicking the <van-password-input>.

When this happens:

  • User taps the input area.
  • Cursor appears inside <van-password-input>, but the virtual keyboard (van-number-keyboard) is not shown.
  • If the user switches to another app (home button), then switches back — the keyboard will appear normally.

This issue seems to occur intermittently on real iOS devices only.


Example Code:

xml
<van-password-input
  class="password-input"
  :value="codeValue"
  :length="6"
  :mask="false"
  :gutter="12"
  :focused="showKeyboard"
  readonly
  @touchstart.prevent="focusKeyboard"
/>

<van-number-keyboard
  v-model="codeValue"
  :maxlength="6"
  :show="showKeyboard"
  @blur="showKeyboard = false"
/>


### Reproduce Steps

1. 在 iOS App 的 WebView 中打开嵌入的 H5 页面。
2. 页面加载完成后,点击验证码输入框(van-password-input)。
3. 此时偶现不会弹出 van-number-keyboard 虚拟键盘。
4. 切换到后台(或切到别的 App),再切回来。
5. 再次点击输入框,此时键盘才会正常唤起
6. 视频文件见附件

https://github.com/user-attachments/assets/886a4b5e-24d5-4fc1-aa9d-240515d0f9a4

### Device / Browser

ios上