App.js

import React, { Component } from 'react';

class App extends Component {
  constructor(props) {
      super(props);
      this.stateTimeDate = {timeDate: new Date()};
  //<p>要顯示的內(nèi)容
      this.state = {
          value: ""
      };
  };
  inputChange(e){
//當(dāng)輸入框的值變化的時候，修改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;

效果圖

1.png