App.js
import React, { Component } from 'react';
class App extends Component {
constructor(props) {
super(props);
this.stateTimeDate = {timeDate: new Date()};
//<p>要显示的内容
this.state = {
value: ""
};
};
inputChange(e){
//当输入框的值变化的时候,修改state对象中的value值;
this.setState({
value : e.target.value
})
};
render() {
return (
<div>
<div>
<h2>It is {this.stateTimeDate.timeDate.toLocaleTimeString()}.</h2>
</div>
<div>
<input placeholder="请输入文本" value={this.state.value} onChange={this.inputChange.bind(this)}></input>
<p>{this.state.value}</p>
</div>
</div>
);
}
}
export default App;
效果图