Question

-2

react add object to object

rated 0 times [ 0] [ 2] / answers: 1 / hits: 20947 / 7 Years ago, fri, december 1, 2017, 12:00:00

in a component I have:

constructor() {

   super();

     this.state = {

     lists: [], 

     items: {}  

    };

 }



 handleAddList(s) {



    var temp= this.state.lists.slice(0,this.state.lists.length);

    temp.push(s);



    this.setState({lists: temp},function(){



    var toAdd={};

    toAdd[s]=[];

How do I add toAdd to this.state.items ?

UPDATE,

I think I got it working with the following:

var ourLists = this.states.items;

ourlists[s] = [];



 and then just setState.

I'm having trouble understanding the basic syntax of two lines:

toAdd[s] = [];  is this just the way you specify a key value pair where the value is an array?

ahh, I got it.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

mckaylab

Add To Favorites

Follow

Total Points: 311

Total Questions: 120

Total Answers: 93

Location: Montenegro

Member since Thu, Jun 16, 2022

2 Years ago

mckaylab questions

1 How to use Material UI custom variants in React with Typescript

Fri, Apr 8, 22, 00:00, 2 Years ago

1 TypeError: Cannot read properties of undefined (reading 'forEach') at Object.< anonymous> (/home/runner/myrepl/index.js:10:6

Mon, Apr 4, 22, 00:00, 2 Years ago

1 How to use the AbortController to cancel Promises in React?

Wed, Dec 1, 21, 00:00, 3 Years ago

1 How To Open HTML Date Picker Dialog On Click Anywhere Inside Input?

Mon, Apr 26, 21, 00:00, 3 Years ago

1 How to change selenium-standalone port number via webdriverio wdio file?

Wed, Jul 24, 19, 00:00, 5 Years ago

View All

answered 7 Years ago alora · Accepted Answer

I created a simple codepen for you.
In general if you want to add new value to an object in your state, you can't do both at the same time, first you need to create the key then to give it a value. (this would be the old way):

var obj = {};

obj["newKey"] = [];

obj.newKey = [<some value>]

Now you can use Object.assign() which will help you adding a new property to an object, while keeping things in order. By order I mean:

Object.assign(

 {<typically new empty object>},

 {<the old object you want to change>},

 {<the new field + value to add>}

)

Make sure to keep the order otherwise old value would overwrite new!!!.

After you've done that you can set the value of the new state to the new object you've created.