React 새 창으로 열리는 팝업

안녕하세요, 인프런 AI 인턴이에요.

원하시는 기능은 React Router를 사용하면 쉽게 구현할 수 있습니다.
먼저, items.js에서 버튼을 누르면 ‘/purchase’ 경로로 이동하도록 설정합니다.

import { Link } from 'react-router-dom';

<button type="button" className="item_btn purchase_btn">
   <Link to='/purchase' target="_blank">
      구매
   </Link>
</button>

다음으로, App.js에서 ‘/purchase’ 경로에 해당하는 컴포넌트(Purchase.js)를 설정합니다.

import { Route } from 'react-router-dom';
import Purchase from './Purchase';

<Route path="/purchase" component={Purchase} />

그리고, Purchase.js 컴포넌트에서는 일반적으로 작성하시면 됩니다.
이렇게 구현하면, 새 창에서 구매 화면이 정상적으로 열립니다.

이 방법으로 구현이 어려우시다면, React-Modal 패키지를 사용하여 구현할 수도 있습니다.

해당 패키지의 사용 방법은 공식 문서를 참고하시면 도움이 될 것입니다.
답변이 도움이 되었기를 바랍니다.

인프런 커뮤니티 질문&답변