0

何がうまくいかないのかわかりません。ボタンをクリックすると、状態と状態の設定が設定され、キーが true に変更され、そのキーが true の場合、別の出力がレンダリングされます。コードは次のとおりです。

クリックボタン呼び出し機能:

<input type="submit" value="I can play" onClick={() => this.canPlay()}/>

この関数を実行します:

 canPlay: function() {
    let name = this.props.value;
    console.log(name, 'name');
    let email = 'mark@mail';
    this.submitUserResponseCanPlay(this.today(), name, email)
    this.setState({thanks: true}) //SET STATE HERE
  },

（ありがとうはgetInitialStateでfalseに設定されています）

次に、レンダリング関数で：

render: function(){
    let output;
    if (this.state.thanks){
      output = <Thanks />;
    }

状態が true の場合、新しい出力をレンダリングします。` 部分は、次のような render 関数内に return 部分があるだけのクラスです。

var Thanks = React.createClass({

  render: function(){
    return (
      <div id="results" className="search-results">
        Thanks, your answer has been recorded!
      </div>
    )
  }

});

しかし、これは表示されません。なぜですか？

奇妙なことは、私のファイルの別の部分でこのようなものであり、その部分が機能することです。つまり、以前に送信ボタンをクリックすると、キーと値のペアが false から true に変更され、新しいページ レイアウトがレンダリングされます。ここで働いていないだけです。多分私は小さな何かを逃した..

4

2 に答える 2

0 
render: function(){
let output;
if (this.state.thanks){
  output = <Thanks />;
}

これは

render: function(){
if (this.state.thanks){
  return <Thanks />
}

常に何かを返す必要がありますrender

于 2016-11-11T16:04:03.007 に答える