React state changing when pushing nested object

Kunal

I'm trying to add/push a javascript object (let's call this 'session') to this.state.sessions.

I've tried this two ways:
1) Concat'ing the new session

this.setState({sessions: this.state.sessions.concat(session)});

2) Using React's immutability helpers

var newState = React.addons.update(this.state, {
            sessions : {
                $push : [session]
            }
        });
this.setState(newState);

While the shallow data (e.g. sessions[i].location) is added correctly, the problem is that all prior session's scope is now set to the new session.scope. In the picture link below you can see that the first session's scope values (sessions[0].scope) were overwritten by the second session's scope values (sessions[1].scope). How do I ensure that when I add a new session, prior session's values aren't affected?

App state picture

Maneeshpal

I think this has little to do with react, and the problem might be that the object in sessions[0].scope is copied by reference. That scope object might be reference shared between the old and new session values.

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

React state changing when pushing nested object

From Dev

React state empty when changing route

From Java

Pushing Object Into Nested Reducer Array?

From Dev

Changing the state of a React Component

From Dev

changing a nested property of an object

From Dev

changing a nested property of an object

From Dev

Changing nested object values

From Dev

Pushing Nested Javascript Object properties into multiple arrays

From Dev

Pushing object to nested JSON using PHP?

From Dev

React: how to map a nested array object from state?

From Dev

Updating state data in a nested object format in react using setState method

From Dev

React nested state modification

From Dev

React state nested attributes

From Dev

Item not displaying when pushing data from asyncstorage to array object in React Native?

From Java

Changing nested object's structure

From Dev

Redux reducers -- changing deeply-nested state

From Dev

A state is undefined object when using React and Redux , Router

From Dev

Pushing the content without it changing width when opening sidebar

From Dev

Updating a deeply nested object in the state

From Dev

onChange object in state in React

From Dev

Pushing data to (nested) array, depending on existing object field

From Dev

Pushing nested objects to next object in array [functional style]

From Dev

How should I go about changing the state of siblings when a child is clicked in React?

From Dev

Can't figure out why React state is changing when I am not mutating any of the data or setting state anywhere

From Dev

React-Redux update state of immutable object with nested array, delete element from array

From Dev

When pushing a new object, a pointer to that object becomes garbage

From Dev

React js changing state does not update component

From Dev

How to store values in react, that are not state changing?

From Dev

react update screen after changing values in the state

Related Related

  1. 1

    React state changing when pushing nested object

  2. 2

    React state empty when changing route

  3. 3

    Pushing Object Into Nested Reducer Array?

  4. 4

    Changing the state of a React Component

  5. 5

    changing a nested property of an object

  6. 6

    changing a nested property of an object

  7. 7

    Changing nested object values

  8. 8

    Pushing Nested Javascript Object properties into multiple arrays

  9. 9

    Pushing object to nested JSON using PHP?

  10. 10

    React: how to map a nested array object from state?

  11. 11

    Updating state data in a nested object format in react using setState method

  12. 12

    React nested state modification

  13. 13

    React state nested attributes

  14. 14

    Item not displaying when pushing data from asyncstorage to array object in React Native?

  15. 15

    Changing nested object's structure

  16. 16

    Redux reducers -- changing deeply-nested state

  17. 17

    A state is undefined object when using React and Redux , Router

  18. 18

    Pushing the content without it changing width when opening sidebar

  19. 19

    Updating a deeply nested object in the state

  20. 20

    onChange object in state in React

  21. 21

    Pushing data to (nested) array, depending on existing object field

  22. 22

    Pushing nested objects to next object in array [functional style]

  23. 23

    How should I go about changing the state of siblings when a child is clicked in React?

  24. 24

    Can't figure out why React state is changing when I am not mutating any of the data or setting state anywhere

  25. 25

    React-Redux update state of immutable object with nested array, delete element from array

  26. 26

    When pushing a new object, a pointer to that object becomes garbage

  27. 27

    React js changing state does not update component

  28. 28

    How to store values in react, that are not state changing?

  29. 29

    react update screen after changing values in the state

HotTag

Archive