[React]중첩 컴포넌트 state 전송하기

[React]중첩 컴포넌트 state 전송하기

props로 state 전송하기

하위 컴포넌트가 늘어나 최상위 컴포넌트의 state 사용하고 싶은 경우 한 단계씩 state를 props로 전송하는 방법이 있다.

Detail.js

  function Info(){
    return(
      <p>재고 : ??</p>
    )
  }

App.js

let [재고, 재고변경] = useState([10,11,12]);

      <Route path="/detail/:id">
        <Detail shoes={shoes} 재고={재고}/>
      </Route>

Detail.js

<Info 재고={props.재고}></Info>

  function Info(props){
    return(
      <p>재고 : {props.재고[0]}</p>
    )
  }