State

딱이·2021년 4월 4일
0

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

state의 두가지 종류

  • 클래스형 컴포넌트가 지니고 있는 state
  • 함수형 컴포넌트에서 useState라는 함수를 통해 사용하는 state

props는 부모 컴포넌트가 설정하는 값, 컴포는트 자신은 해당 props를 읽기 전용으로만 사용할 수 있다.
수정을 하려면 부모 컴포넌트에서 바꿔 줘야함.

#1 constructor 매서드를 통한 설정

import React, {Component} from 'react';

class App extends Component {
    constructor(props) {
        super(props);
        this.state = {
            number: 0,
            fixedNumber: 0
        }
    }

  render() {
        const { number, fixedNumber } = this.state;
        return (
          <div>
          ...
          </div>
      );
    }
}

export default App;

#2 state를 constructor에서 꺼내기

import React, {Component} from 'react';

class App extends Component {
    state = {
            number: 0,
            fixedNumber: 0
    };
        
    render() {
       const { number, fixedNumber } = this.state;
       return (
          <div>
            ...
          </div>
      );
    }
}

export default App;
profile
뚝딱뚝딱 FE

0개의 댓글