Duplicate enries in state when adding files

I'm using the felepond npm package, to display files, and I have a function, that adds a new file as such

onupdatefiles={fileItems => {
  fileItems.forEach((item, i) => {
    console.log(item.file);
    const file = {
      name: item.file.name,
      data: item.file,
      extension: item.file.type
    };
    this.setState(prevState => ({
      fileObjects: [...prevState.fileObjects, file]
    }));
  });
}}

the problem here is that the entire state is added every time a new entry to the list is made...

I was wondering if you could make it a set, but that would be a mess to figure out

is there a way that I can make sure there are no duplicate entries in the state?

Upvotes: 1

Views: 43

Answers (1)

Tholle
Tholle

Reputation: 112777

You will get all the files in the callback, so you could overwrite the files currently in your state with just the ones you get in the callback.

onupdatefiles={fileItems => {
  const fileObjects = [];

  fileItems.forEach((item, i) => {
    fileObjects.push({
      name: item.file.name,
      data: item.file,
      extension: item.file.type
    });
  });

  this.setState({ fileObjects });
}}

Upvotes: 1

Related Questions