Unable to add to an array of objects copied from state

Question

I have a list of file names populating in the UI. I'd like to add to this list on the front end (that.state.selectedReq.userUploads) after a file is uploaded to the API. Im creating a copy of what's in state with let userFiles = Object.assign and then want to iterate through the list of files to upload and add them to the copy of the array of what's in state. I then want to setState with the new array. However, I'm erroring out on the line userFiles.push(upload); and I'm not sure why.

var i = 100;
let userFiles = Object.assign({}, that.state.selectedReq.userUploads);
that.state.selectedFiles.forEach((x) => {
  let upload = {
    documentName: x.name,
    userUploadId: i,
    notes: "undefined"
   };
    i--;
    userFiles.push(upload);
  })

  that.setState({
    uploadFileInProgress: false,
    userUploads: userFiles
  })

Is there a better way to do what I'm trying to accomplish?

Can you show the error you said you're getting? – Sterling Archer Feb 20 '20 at 15:49 — Sterling Archer, Feb 20 '20 at 15:49
What is the error message what you get there? – norbitrial Feb 20 '20 at 15:49 — norbitrial, Feb 20 '20 at 15:49
`userFiles` is not a list. – Joseph D. Feb 20 '20 at 15:50 — Joseph D., Feb 20 '20 at 15:50

Junius L · Answer 1 · 2020-02-20T21:10:25.830

3

Object.assign() returns an object, use spread operator to copy the array in state.

let userFiles = [...that.state.selectedReq.userUploads];

edited Feb 20 '20 at 21:10

answered Feb 20 '20 at 15:51

Junius L

15,881
6
52
96

score 0 · Answer 2 · answered Feb 20 '20 at 15:50

.push() is a method of an array, not an object. Object.assign() will generate an object, that's why your code is erroring out.

If your state.selectedReq.userUploads is an array, you can do this:

let userFiles = that.state.selectedReq.userUploads.slice();
...
userFiles.push(upload);

If your state.selectedReq.userUploads is an object, you can do something like this:

let userFiles = Object.assign({}, that.state.selectedReq.userUploads);
...
userFiles[x.name] = upload;

Unable to add to an array of objects copied from state

2 Answers2