react-父组件将状态做为属性传递给子组件

数据自顶向下流动

import React, { Component } from 'react';
// import img01 from './images/01.png'
import './App.css';

class App extends Component {


  render() {
    class Son extends Component{
      render(){
        return (
          son component :{this.props.dd.toLocaleTimeString()} {this.props.aa}
        )
      }
    }
    //使用类就允许我们使用其它特性,例如局部状态、生命周期钩子
    class Clock extends Component{

      constructor(props){
        super(props);
        this.state={
          date:new Date()
        }
      }
      componentDidMount(){
        this.timer=setInterval(
          ()=>this.tick()
        ,1000)
      }
      componentWillUnmount(){
        clearInterval(this.timer)
      }
      tick(){
        this.setState({
          date:new Date()
        })
      }

     

      render(){
        return(
          
today: {this.state.date.toLocaleTimeString()} //将父组件状态作为属性dd 传递给子组件Son
) } } return (
); } } export default App;

 

你可能感兴趣的:(react)