React - 로그인, 로그아웃 여부에 따라 Header 조건부 렌더링하기(1)

로그인, 로그아웃 여부에 따라 Header 조건부 렌더링하기 (1)

- component가 모두 접근할 수 있도록 context를 사용한다. 

 

context.js에서 createContext import 해준 뒤 다음과 같이 기본적으로 context와 provider 작성을 해준다.

 

// UserContext : Application 내의 데이터 저장소
const UserContext = React.createContext();

const UserContextProvider = ({children}) => {
	<UserContext.Provider>{children}</UserContext.Provider>
}

export default UserContextProvider;

 

여기에서 추가적으로 값을 전달해야할 것이며, state도 갖고 있어야 한다.