<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>W3Cschool教程 React 实例</title> <script src="//www.w3cschool.cn/statics/assets/react/react.min.js"></script> <script src="//www.w3cschool.cn/statics/assets/react/react-dom.min.js"></script> <script src="//www.w3cschool.cn/statics/assets/react/babel.min.js"></script> </head> <body> <div id="example"></div> <script type="text/babel"> var HelloMessage = React.createClass({ getInitialState: function() { return {count: 0}; }, handleChange: function(event) { this.setState({count: event.target.value}); }, render: function(){ let count = this.state.count; return <div> <button type="text" value={1+parseInt(count)} onClick={this.handleChange} >点击按钮加1</button> <h4>{count}</h4> </div>; } }); ReactDOM.render( <HelloMessage />, document.getElementById('example') ); </script> </body> </html>
小例子(点击按钮数值加一)
最新推荐文章于 2023-08-15 09:15:38 发布