본문 바로가기

REACT

노마드 코더 state 와 componentDidMount와 componentDidUpdate 예제

import React from 'react';



class App extends React.Component{
  constructor(props){
    super(props)
    console.log("hello")
  }
  state = {
    count: 0 
  };
  add = () => {
    this.setState(current => ({ count:current.count +1 }));
  }
  minus = () => {
    this.setState(current => ({ count:current.count -1 }));
  };
  componentDidMount(){
    console.log("component rendered");
  }
  componentDidUpdate(){
    console.log("i just updated");
  }
  render(){
    console.log("im rendering"); 
    return( 
    <div>
        <h1>The number is:{this.state.count}</h1>
        <button onClick={this.add}>Add</button> 
        <button onClick={this.minus}>Minus</button>
    </div>
   )
  }
}

export default App;

'REACT' 카테고리의 다른 글

노마드코더 useState useEffect 예제  (0) 2020.07.08
노마드코더 useState 예제  (0) 2020.07.08
노마드 코더 props , map 기본 예제  (0) 2020.06.30
노마드 코더 props 기본 예제  (0) 2020.06.30
axios 예제  (0) 2020.06.07