Vue3 - 移动端H5网页点击输入框弹出软键盘后，收起后页面无法复原的问题，页面没能恢复原状+遮盖遮挡+布局出现上移或下移整体未复原到打开软键盘之前（解决弹出键盘导致页面布局错乱，安卓+苹果ios）

前言

如果您需要 Vue2 版本，请访问 这篇文章。

在 vue3 H5移动端网页开发中，解决手机h5页面点击输入框弹起软键盘后，收回键盘时页面没恢复到原状，包括但不限于键盘收回后页面不回落、页面顶起不恢复、键盘遮盖输入框、布局错位错乱、页面整体上移或下移、收起后会导致页面被顶起无法复原、弹出与收起影响定位布局等问题，解决手机移动端h5网页各种因为 “软键盘弹出+收起” 带来的各种页面变化，提供详细示例代码。

解决各种软键盘问题，只要页面发生了"变化"没复原就可以解决。

---

如下图所示，强力解决键盘开启和收起后，布局发生了变化。

详细代码，保证搞定

解决方案

按照下方说明分析及示例代码，轻松搞定此问题。