最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - React JS maintain array inside state - Stack Overflow

programmeradmin3浏览0评论

I have been using React state to maintain some data. For ints and strings it's working well, but unfortunately arrays are not working.

In my ponent constructor, I have

constructor(props) {
    super(props);

    this.state = {
        terms: 5,
        myArray: []
    }

and then, I am trying to maintain it in ponentDidUpdate

ponentDidUpdate() {
    this.state = {
        terms: this.state.terms,
        myArray: this.state.myArray
    }

but myArray: this.state.myArray is not working. However terms: this.state.terms is working perfectly.

Can someone help!

I have been using React state to maintain some data. For ints and strings it's working well, but unfortunately arrays are not working.

In my ponent constructor, I have

constructor(props) {
    super(props);

    this.state = {
        terms: 5,
        myArray: []
    }

and then, I am trying to maintain it in ponentDidUpdate

ponentDidUpdate() {
    this.state = {
        terms: this.state.terms,
        myArray: this.state.myArray
    }

but myArray: this.state.myArray is not working. However terms: this.state.terms is working perfectly.

Can someone help!

Share Improve this question edited Mar 31, 2017 at 17:42 nbkhope 7,4744 gold badges43 silver badges59 bronze badges asked Mar 31, 2017 at 14:13 h_hh_h 1,2314 gold badges28 silver badges47 bronze badges 4
  • 1 why do you want to setState in ponentDidUpdate method ?? and one more thing what do you mean by not working, r u trying to update the array ? – Mayank Shukla Commented Mar 31, 2017 at 14:17
  • and also you should use this.setState() to update state – dynamo Commented Mar 31, 2017 at 14:18
  • After rendering ponents, I have to change other state values. – h_h Commented Mar 31, 2017 at 14:19
  • @ Mayank Shukla Actually, I am re initialising state due to some reason, Anyhow never mind. I resolved my problem. But thank you for your timely reply. I really appreciate. – h_h Commented Mar 31, 2017 at 16:03
Add a ment  | 

3 Answers 3

Reset to default 4

Issue is you are updating the state value in a wrong way, Update the state value like this:

this.setState({
     terms: this.state.terms,
     myArray : this.state.myArray
});

As per DOC:

Never mutate this.state directly, as calling setState() afterwards may replace the mutation you made. Treat this.state as if it were immutable.

Update the state array like this, first create a copy of that by using slice(), then do the change and use setState to update:

let arr = this.state.myarr.slice();
arr.push('data');
this.setState({arr});

You cannot set state directly like that since its an array you will have to append the value or else push the value.

try something like

var newArray = this.state.myArray.slice();    
newArray.push("new value");   
this.setState({myArray:newArray})

here i sliced to make it immutable.

You cannot use this.state with purpose to update state, you have to use:

this.setState(newStateObject);
发布评论

评论列表(0)

  1. 暂无评论