Назад к задачамПолучайте помощь с лайвкодингом в реальном времени с Sobes Copilot
Junior — Senior
5
Обнаружить и исправить ошибки в React‑компоненте
Условие задачи
В представленном ниже React‑компоненте присутствуют логические ошибки, из‑за которых поле ввода не получает фокус при отображении. Найдите и исправьте их, изменив код так, чтобы кнопка показывала инпут и сразу ставила на него курсор.
import { useRef, useState } from "react";
export default function App() {
const [visible, setVisible] = useState(false);
const refInput = useRef();
const handleToggle = () => {
setVisible(true);
refInput.current.focus();
};
return (
<div>
<button onClick={handleToggle}>Show and focus input</button>
{visible && <input ref={refInput} type="text" />}
</div>
);
}