Question

给出计数，我试图渲染一个按钮并在文本中显示数字。

例如，如果count为5，那么我正在尝试将<Button>1</Button>设为<Button>5</Button>。

我该怎么做才能做出反应？

Answer 1

您可以在state内显示button。onClick事件设置新状态

var Counter = React.createClass({
  getInitialState: function () {
    return { counter: 0 };
  },
  	
  handleClick: function () {
    this.setState({ counter: this.state.counter + 1 });
  },
  
  render: function() {
    return <div>
      <button onClick={ this.handleClick }>{ this.state.counter }</button>
    </div>
  }
});

ReactDOM.render(<Counter />, document.getElementById('container'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="container"></div>

如何在反应中多次渲染元素

1 个答案: