0

I'm trying to use file upload data and as soon as file dropped the data should be contained in state

So this is the code that make an error :

const handleOnDrop = data => {
  const infos = data.map(item => item.data);
  setTimeout(() => setInfo([...infos]), 1000);
};

And I tried to fix it with this :

const handleOnDrop = async data => {
  const infos = data.map(item => item.data);
  await setTimeout(() => setInfo([...infos]), 1000);
};

However, I still got the same error :

index.js:1 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.

And this is the way I use it :

<CSVReader
    onDrop={handleOnDrop}
    onError={handleOnError}
    style={{}}
    config={
        (({ fastMode: true }, { chunk: "LocalChunkSize" }),
            { header: false })
    }
    addRemoveButton
    onRemoveFile={handleOnRemoveFile}
>

I use it from papaprse, but I can't figure it why it happens. I want to know how I can fix this issue, and I want to know why it happens.

Carlotta
  • 334
  • 1
  • 13
KYUN
  • 185
  • 5
  • 1
    why would you use a `setTimeout` there? is there a reason for that? – amitlisha Aug 20 '21 at 08:45
  • I didn't use it but i tried to fix that issue with that and if i get rid of `setTimeout` , but i still get same issue . Thank you for answering Sir. – KYUN Aug 20 '21 at 08:49
  • and I don't need to use it ! – KYUN Aug 20 '21 at 08:49
  • 1
    So a quick fix for this would be, before setting the state is to check if the component is still mounted, by managing your own `isMounted` state that you change to false in the `componentWillUnMount` or its functional component similar, you can read more about it [here](https://stackoverflow.com/questions/56442582/react-hooks-cant-perform-a-react-state-update-on-an-unmounted-component). But that won't really help you, you need to understand why is the component getting unmounted in this function and prevent it. – amitlisha Aug 20 '21 at 12:19

0 Answers0