Context 문법으로 props 없이 state 공유

박시하·2021년 12월 1일
0

React

목록 보기
13/17

Context 문법으로 props 없이 state 공유

let context = React.createContext();

state 값을 공유하고 싶으면 context 만든다
그냥 createContext()라는 함수를 이용해 변수를 만듭니다
그럼 그 변수는 <컴포넌트>가 됩니다.

let 재고context = React.createContext();
function App(){

  return (
    <HTML많은곳/>
    <context.Provider value={재고}>
      
    </context.Provider>
    
  )
}

<범위></범위>로 전부 감쌉니다.
그리고 value={state이름} 이렇게 공유할 state를 집어넣으면 됩니다

import React, {useState, useContext} from 'react';
function Card(){
  let 재고 = useContext(재고context);
  return (
    <HTML많은곳/>
    <Test></Test>
  )
}
function Test(){
  return <p> 재고 : ???? </p>
}
let 재고 = useContext(재고context);

useContext로 데이터를 받아서 사용

import {재고context} from './App.js';

App.js에서 export하고 다른.js에서 import 해주시면 됩니다.

profile
기본 회원

0개의 댓글