본문 바로가기
개인공부/코딩애플

[React1] class이용하기

by 뭉지야 2023. 6. 13.
728x90
class Modal2 extends React.Component {
  //constructor, super, render 채워넣어야함
}

 

 

class Modal2 extends React.Component {
  constructor() {
    super();
  }
  render() {
    return <div>안녕</div>;
  }
}

이렇게 해서 Modal2 컴포넌트가 생긴다.

 


class컴포넌트에서 state만들려면

class Modal2 extends React.Component {
  constructor() {
    super();
    this.state = {
      name: "kim",
      age: 20,
    };
  }
  render() {
    return <div>안녕 {this.state.name}</div>;
  }
}

state 변경하려면

 <button
          onClick={() => {
            this.setState({ age: 21 });
          }}
        >
          버튼
        </button>

props사용하려

class Modal2 extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      name: "kim",
      age: 20,
    };
  }
  render() {
    return <div>안녕 {this.props}</div>;
  }
}
728x90