last day (14 days later) » 

17:14
0
A: unsure why state is changing

Felix Klingtl;dr: Your code is working fine. What you are seeing is a consequence of how objects and the console work. Do console.log(this.state.survey[0].Id); instead to see that the property does actually exist. See also Is Chrome's JavaScript console lazy about evaluating arrays? When I remove...

It looks like updateSurveyQuestions and newSurveyQuestions are mutating the object directly, which I don't understand because I'm passing a copy of state to it, correct?
"because I'm passing a copy of state to it" All I can see is that you are passing this.state.survey, which is not a copy. JavaScript represents objects (arrays are objects too) as references. They are not copied on assignment.
I create copy of state like so, let survey = [...this.state.survey], and passed survey into my functions. still getting same error.
That only creates an copy of the array itself, but not the objects inside the array. I.e. survey[0] === this.state.survey[0].
I know. In my helper functions I work with the array accordingly.
What's strange is my state is being changed as well, even though I'm not setting state in my helper functions. This is breaking my code since the properties Id and SEO_CSEO_Survey_Questions__r are required in other parts of my web app.
17:14
As I have said, you would have to make a copy of the object you are going to change.
I've included the helper function in my original post to show that it is indeed copying the object in state.
As I said, that only creates a shallow copy of the array itself, but not the objects within the array.
s[0] and survey[0] refer to the same object.
so I can't make a copy of the whole array, it needs to be only the object?
wow
let's give it a try then...
Well, you can make a copy of the array. But the more important thing is that you make a copy of the value that you are actually changing, which is the object.
E.g. var obj = Object.assign({}, survey[0]) is an easy way to create a shallow copy.
why is state changing though? I'm not using this.setState in my parent component
17:24
Unless you are creating a copy of the object, there is only this single instance of that object in your application. This object can be referenced from multiple places (state, local variables, etc). But since all of these places reference the same object, any changes to that object will be visible on all these places.
this seems to be going against what I know about react. I was under the impression that this.setState() can only change the object. I then pass down the state object to a child component, which uses its props to use the property that I need. this.props.survey[0].SEO__CSEO_Survey_Questions__r.records
It's simply how JavaScript works. Which is why it is explicitly called out in the React documentation to not change the state directly: facebook.github.io/react/docs/…
wow that's right
That also applies to any other nested values in the state and of course also applies to any mutation operations, not just assignments.
so... here is the main problem to my post. I need to not include some properties in the object in order to do an API request.
I guess I need to create a brand new object?
and reference the values from my state?
17:34
If you just want a subset of the properties and not actually change your state, that doing what I have shown above (`var obj = Object.assign({}, survey[0])`) will create a copy of the object from which you can remove the properties.

Or you could simply build a new object by picking the properties you need (e.g. something like `var data = {foo: survey[0].foo, bar: survey[0].bar};`.
17:59
awesome, thank you! I got it to work thanks to your input.
You're welcome!

last day (14 days later) »