Назад к задачамПолучайте помощь с лайвкодингом в реальном времени с Sobes Copilot
Junior — Senior
5
Переключатель форм с очисткой ввода
Условие задачи
Необходимо реализовать очистку значения поля ввода при изменении состояния чекбокса. Когда галочка отмечена – отображается первая форма, когда снята – вторая. При переключении формы её содержимое должно сбрасываться.
import React from 'react';
export function App(props) {
const [checked, setChecked] = React.useState(true);
const onToggle = event => {
setChecked(event.target.checked);
};
const FormOne = () => {
return (
<form>
<label>Name 1</label>
<input type='text' />
</form>
);
};
const FormTwo = () => {
return (
<form>
<label>Name 2</label>
<input type='text' />
</form>
);
};
const activeForm = checked ? <FormOne /> : <FormTwo />;
return (
<div className='App'>
<div>
<label>test</label>
<input type='checkbox' checked={checked} onChange={onToggle} />
</div>
{activeForm}
</div>
);
}