10 простых шагов, которым вы можете следовать:
1.прежде всего создал JSX в котором создал форму и ввод.
2. в разделе ввода я добавил onChange, который будет принимать пользовательский ввод
3.создал состояние с двумя значениями, первое из которых было пустым.
4. создал функцию onChange, в которой ввел event.target.value во второе состояние для хранения данных, определяющих значение ввода.
5. добавлена функция отправки на кнопку формы, которая является встроенной функцией формы реагирования.
6.добавлено имя функции на форму с событием onSubmit.
7.used предотвращает значение по умолчанию в функции onSubmit, поэтому, если страница перезагружается нажатием кнопки, сохраненные данные не теряются.
8.добавлено все, что нужно сохранять во втором состоянии при перезагрузке страницы.
9. теперь данные сохраняются, но входное значение не удаляется автоматически, если мы не удалим его вручную.
10.использовал второе состояние как пустую строку в функции, так что если страница перезагружается, она удаляет значение поля ввода.
Код :
функция экспорта по умолчанию App() {
const [enteredTitle, setEnteredTitle] = useState(“”);
const inputChanged = (event) =› {
setEnteredTitle(event.target.value);
};
const submitHandler = (event) =› {
event.preventDefault();
const myData = {
название: введеноЗаголовок,
};
setEnteredTitle(“”);
console.log(myData);
};
возврат (
‹раздел›
‹form onSubmit={submitHandler}›
‹input onChange={inputChanged} type=”text” value={enteredTitle} /›
‹button type="submit"›submit‹/button›
‹/форма›
‹/дел›
);
}
