Блог

Я использую крючок useState() как я могу обновить свое состояние, которое я хочу назначить readAsDataURL.result, чтобы я мог загрузить файл?

 const uploadFile = event => {
  let reader = new FileReader();
  let file = event.target.files[0];
  console.log(file); //I can see the file's info

  reader.onload = event => {
    console.log("event", event.target.result);

    setSelectedFile(event.target.result); //its giving me null here how can i update state?
  };
  reader.readAsDataURL(file);
  console.log("State", selectedFile);
};

 

Чтобы обновить состояние, все, что вам нужно, — это вызвать соответствующую функцию состояния.

Это делается для создания государства.

 const [count, setCount] = useState(0);
 

Здесь count-это ваша переменная и функция состояния setCount, соответствующая ей.

 setCount(1);
 

При вызове этой функции count значение изменится на 1 . Таким образом, вы также можете обновить любое состояние, которое вы определяете.

В своем коде вы не указали код своего штата. Так что попробуйте сформулировать это, отредактировав свой вопрос.

Редактировать

В react useState крюк используется для установки состояния, которое может быть любым значением number list , object и т.д. useState возвращает переменную состояния и соответствующую функцию для обновления этого состояния, и эта соответствующая функция является асинхронной функцией и не обновила состояние сразу. Чтобы проверить, было ли обновлено состояние, требуется другой хук, называемый useEffect . хук useState будет запускаться при каждом изменении состояния.

Поэтому, например, чтобы узнать selectedFile , было ли изменено состояние, мы можем использовать приведенный ниже код для запуска при изменении состояния выбранного файла, а затем консоли.регистрируйте значение состояния selectedFile :

 const [selectedFile, setSelectedFile] = useState(null);
useEffect(() => {
  console.log(selectedFile);
}, [selectedFile]);