Почему не изменяется useState?

Question

[Evgen Bolat]

Смог кое-как сделать сохранение url файлов в обычный массив, но почему-то после setFileArray fileArray остаётся неизменным.

Прикладываю код. Буду благодарен за помощь!

Суть махинаций в том, чтобы записать url изображений в массив в fileArray.

import { useState } from "react";
import "./TaskForm.css";
import { wait } from "@testing-library/user-event/dist/utils";

const TaskForm = (props: any) => {
  const [typeofTask, setTypeOfTask] = useState("");
  const [filesArray, setFiles] = useState([""]);
  const fileList: any = [""];
  let lengthofReaded = 0
  let filesLength = 0

  function readmultifiles(e: any) {
    const files = e.currentTarget.files;
    filesLength = files.length
    Object.keys(files).forEach((i) => {
      const file = files[i];
      const reader = new FileReader();
      reader.onload = (e) => {
        var res = e.target?.result;
        if (typeof res === "string") {
          fileList.push(res);
          ++lengthofReaded
        }
        if(lengthofReaded === filesLength){
            setFiles([...fileList])
        }
      };
      reader.readAsDataURL(file);
    });
  }

  return (
    <div>
      <form
        onSubmit={(e) => {
          e.preventDefault();
        }}
      >
        <h1 hidden={typeofTask === ""}>Добавьте файлы, если это необходимо</h1>
        <label htmlFor="files" hidden={typeofTask === ""}>
          <img src={`${process.env.PUBLIC_URL}/img/document.svg`} alt="" />
        </label>
        <input
          hidden
          type="file"
          name="files"
          id="files"
          multiple
          onChange={(e) => {
            readmultifiles(e);
          }}
        />
      </form>
    </div>
  );
};

export default TaskForm;

Comments

[WbICHA]

fileArray остаётся неизменным.

Откуда ты знаешь? Ты его не используешь в коде.

[WbICHA]

const fileList: any = [""];

И да, потрясающее решение. Ты решил вообще ничего по реакту не читать?

Answer 1

[JadDy]

Перенесите Ваши переменные fileList и lengthofReaded в функцию readmultifiles, должно сработать