react - state

* state 컴포넌트 내부에서 바뀔 수 있는 값

-> state가 변경되면 화면을 다시 그림.

 

* 함수형 컴포넌트

useState import

const [state, setState] = useState(초기값);

 

import { useState } from 'react';

const MyComState = () => {
        const [countNum, setCountNum] = useState(0);

}

 

* class형 컴포넌트

state 접근 this.state

state 변경 this.setState({})

 

class MyComState extends Component {

    state = {

        countNum: 0,

    }

    render() {

    const { countNum } = this.state;
        return(

            <div>{this.state.countNum}

                <h1>{countNum}</h1>

                <button onClick={()=>{

                    this.setState({countNum: countNum+1})

                 }>

                +1</button>

            </div>

        )

    }

}