0

无法弄清楚出了什么问题。我单击一个按钮，这将设置状态和状态设置，将键更改为真，如果该键为真，则应呈现不同的输出。这是代码：

点击按钮调用功能：

<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 />;
    }

如果状态为真，则渲染新的输出。` 部分是一个类，它在渲染函数中只有一个返回部分，如下所示：

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

我不认为你可以将变量设置为 jsx，所以如果我错了，请忽略这一点。但是在这种情况下，您似乎可能正在尝试渲染 

 {output}

在您的代码中的某处。而是将其替换为

{this.state.thank ? <Thanks /> : null}
于 2016-11-12T00:43:13.743 回答
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 回答