ReactJS, ввод и текстовая область в формах. В мобильной версии клавиатура закрывает поля ввода. ⇐ Android

[Anonymous]

Я столкнулся со следующей проблемой в мобильной версии моего веб-сайта, созданной с помощью ReactJS (в частности, в мини-приложении Telegram). При фокусировке на поле ввода или текстовой области появляющаяся клавиатура закрывает экран. Я попытался решить проблему, прикрепив событие onFocus к входной/текстовой области с помощью следующего кода:

Код: Выделить всё

const handleAppearanceKeyboard = (ref) => {
setIsInputFocused(true);
setTimeout(() => {
if (ref.current) {
ref.current.scrollIntoView({
behavior: "smooth",
block: "start",
inline: "nearest",
});
}
}, 150);
};

Здесь я использовал ссылку с помощью useRef() для поля ввода. Однако на устройствах Android это работает некорректно, а на iPhone оно начинает дрожать при прокрутке.
Как создать работающее решение, чтобы клавиатура всегда отображалась под вводом и не отображалась не перекрывается ли оно при фокусировке? Например, как показано здесь: https://lichess.org/signup.

Подробнее здесь: https://stackoverflow.com/questions/791 ... rs-input-f