は、私は現在、ReactJSプロジェクトを作ってるんだと私は次のような問題に遭遇していコンストラクタ

Question

で呼び出された後の状態を設定していない機能に反応しますコンストラクタそれはそうすることができません。しかし、他の場所で呼び出そうとすると状態が変わります。ここで

はコードです：事前に

class App extends React.Component { 
    constructor(props) { 
     super(props) 
     this.state = { elems: [] } 
     this.changeState() // This doesn't work 
    } 

    changeState() { 
     this.setState({ 
      elems: ['new', 'elem'] 
     }) 
    } 

    render() { 
     return (
      <div> 
       { this.changeState() /* This works */ } 
       {this.state.elems} 
      </div> 
     ) 
    } 
} 

おかげ

Answer 1

なぜあなたは状態がconstructorが取得する

class App extends React.Component { 
    constructor(props) { 
     super(props) 
     this.state = { elems: ['new', 'elem'] } 
    } 


    render() { 
     return (
      <div> 
       {/* This wont work since changeState will cause an infinite loop because setState triggers a render and render triggers a setState */} 
       {/* this.changeState() */ } 
       {this.state.elems} 
      </div> 
     ) 
    } 
} 

Answer 2

のようにコンストラクタで設定しているだけのことができたときに関数を呼び出しますコンポーネントがマウントされてレンダリングされる前に呼び出されるので、コンストラクタで直接ステートを設定することができます。 React Component Lifecycleを参照してください。

これは、あなたがconstuctorの状態を設定することがない方法を次のとおりです。同じ問題に直面して誰のための

constructor(props) { 
    super(props); 
    this.state = { elems: ['new', 'elem'] }; 
} 

Answer 3

、私が見つけた最良の解決策は、両方ないで問題を解決した、componentDidMountで関数を呼び出していましたrenderで呼び出されたときの状態と無限ループを更新します。

助けたすべての人々に感謝し、問題を指摘し、私は解決策を見つける手助けのための両方Felix KlingとMayank Shuklaに特別な感謝;）反応のライフサイクルメソッドで