부자, 자부, 자손, 형제

 - 
   
   Class FartherC extends React.Component{
        constructor(){
            super();
            this.state={
            name:'       ',
            age:'20'
            }
        };
        render(){
            return(
                
// name childrenname // this.state name //'...' , this.state //
) } } Class ChildrenC extends React.Component{ constructor(props){ super(props); this.state={ name:' ' } }; render(){ return(
//

{this.props.name}

) } }
 - 
   
   Class FartherC extends React.Component{
        constructor(){
            super();
            this.state={
            name:'       ',
            age:'20'
            }
        };
        handelParent(obj){//   obj                     ,      
            this.setState({//     name   this.state  name
                name:obj.name
            })
        }
        render(){
            return(
                
) } } Class ChildrenC extends React.Component{ constructor(props){ super(props); this.state={ name:' ' } }; handelChange(event){ //{name:' ',age:'40'} this.props.handelParent({name:event.target.value}); }; render(){ return(
// state name { this.handelChange(event) }}/>
) } }
 - 
   
   Class FartherC extends React.Component{
        constructor(){
            super();
            this.state={
            fname:'    ',
            fage:'20'
            }
        };
        render(){
            return(
                
) } } Class ChildrenC extends React.Component{ constructor(props){ super(props); this.state={ cname:' ' } }; render(){ return(
) } } Class SunC extends React.Component{ constructor(props){ super(props); this.state={ sname:' ' } }; render(){ return(

{this.props.sunname}

) } }
  //A   input     B     
 Class FartherC extends React.Component{
        constructor(){
            super();
            this.state={
            fname:'    ',
            fage:'20'
            }
        };
        ChangeA(obj){//   obj                     ,      
            this.setState({//     name   this.state  name
                name:obj.name
            })
        }
        render(){
            return(
                
) } } A Class ChildrenA extends React.Component{ constructor(){ super(); this.state={ name:' A', age:'21' } }; handelChange(event){ this.props.ChangeA({name:event.target.value}); }; render(){ return(
{ this.handelChange(event)}}/>
) } } B Class ChildrenB extends React.Component{ constructor(){ super(); this.state={ name:' B', age:'20' } }; render(){ return(

{this.props.fname}

) } }

좋은 웹페이지 즐겨찾기