import React,{Component} from 'react';

import Child from './Child.js'

class App extends Component{

  constructor(){

    //初始化属于组件的属性

    super();

    this.state = {

      age:12,

      name:'234'

    }

  }

  render(){

    //结构赋值

    let {age,name} = this.state;

    return(

     <div>

       {/* 组件的使用必须大写 */}

       <Child age={age} name={name}>

        <ul>

          <li>1</li>

          <li>2</li>

          <li>3</li>

        </ul>

       </Child>

     </div>

    )

  }

}

export default App;

 //使用jsx必须引入React

 import React,{Component} from 'react';

 class Child extends Component{

   constructor(props){

     //初始化属于组件的属性

     super(props);

   }

   render(){

     console.log(this.props)

     //声明一个age，name属性，this.props中同名属性进行赋值

     let {age,name} = this.props;

   //this.props.children（三种数据格式）

     return(

       <div>

           child:{age}{name}

           {this.props.children}

       </div>

     )

   }

 }

 export default Child;