Write nested objects in this.state in react js

Question

I am trying to create an object in state in React .What I require us that 'status' is actually a field that is updated by setState

 this.state = {
        data:[],
        sort: 0,
        field:"",
        filters:{
            'status':{
                value:""
            }

The code should be:

this.state = {
        data:[],
        sort: 0,
        field:"",
        filters:{
            field:{
                value:""
            }

How should I set the same object to the nested object?

lloydaf · Accepted Answer · 2018-11-30 04:24:58Z

2

You can do it like so..

let filters = {
  field:{
    value: ""
  }
};

this.setState({filters});

answered Nov 30, 2018 at 4:24

lloydaf

6053 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

JeanAlesi · Accepted Answer · 2018-11-30 04:29:21Z

2

You can do it this way:

this.setState({
  filters: { ...this.state.filters, field: { value: 'new value' },
});

However the above syntax is ugly. I recommend you to use immutability-helper package to update the state.

See this answer on how to update state with immutability helper.

answered Nov 30, 2018 at 4:29

JeanAlesi

5985 silver badges18 bronze badges

2 Comments

JeanAlesi Over a year ago

Note that you may also use the immutable.js library, which has methods specifically for these cases.

beingshuchi Over a year ago

Thanks I got the solution, I worked with the following code this.setState({ filters:{ [field]:{ value:e } }

zx485 · Accepted Answer · 2019-01-21 18:17:55Z

1

Check this out:

this.setState({filters:{[field]:{value:e}}

edited Jan 21, 2019 at 18:17

zx485

29.1k28 gold badges55 silver badges65 bronze badges

answered Jan 21, 2019 at 17:56

Eshita

262 bronze badges

1 Comment

AdrianHHH Over a year ago

Answering questions is good, thank you. But giving an answer that is just code with no explanation is not very useful.

EDISON J · Accepted Answer · 2018-11-30 04:47:04Z

0

setState for nested object.

 this.state = {
        data:[],
        sort: 0,
        field:"",
        filters:{
            status:{
                value:""
            }

If we want update 'status' using setState method follow this method this may help you.

let filters = {...this.state.filters}
filters.status = { value: 10 };
this.setState({filters})

Ref this doc: Link

answered Nov 30, 2018 at 4:47

EDISON J

3444 silver badges14 bronze badges

Collectives™ on Stack Overflow

Write nested objects in this.state in react js

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related