[React] class 문법으로 컴포넌트 생성

class 문법으로 컴포넌트 생성

class 컴포넌트명 extends React.Component {
	constructor(){
    	super()
    }
    rendor(){
    	return (
        	
        )
    }
}

 

사용은 <컴포넌트명 />

 

 

 

class 컴포넌트에서 state 만들기

class 컴포넌트명 extends React.Component {
	constructor(){
    	super();
        this.state = {
        	name : 'park',
            age : 25
        }
       
    }
    rendor(){
    	return (
        	<div>{this.state.name}</div>
            <div>{this.state.age}</div>
        )
    }
}

constructor(){ }에 state를 생성하고

사용은 {this.state.이름}

 

 

 

 

state 변경

class 클래스명 extends React.Component {
	constructor(){
    	super();
        this.state = {
        	name : 'park',
            age : 25
        }
       
    }
    rendor(){
    	return (
        	<div>
            	<button onClick={()=>{
                	this.setState({age:35})
                }}></button>
            </div>
        )
    }
}

this.setState({ })

변경할 값 넣어주면 됩니다!

 

 

 

 

props사용

class 클래스명 extends React.Component {
	constructor(props){
    	super(props);
        this.state = {
        	name : 'park',
            age : 25
        }
       
    }
    rendor(){
    	return (
        	<div>{this.props}</div>
        )
    }
}