Promise 과 await으로 blocking

Tony·2023년 2월 7일
0

react

목록 보기
62/86
post-custom-banner

쓸일은 없겠지만 독특하게 blocking을 구현한 코드를 봐서 메모해 놓으려 한다

// react 코드
const resolveRef = useRef<(value: unknown) => void>(() => {});
const showOpenModal = () => {
  setIsModalOpen(true);

  return new Promise((resolve) => {
    resolveRef.current = resolve;
  });
};

const _handleClickLeftButton = useCallback(() => {
  resolveRef.current(false);
  handleClose();
}, []);

const _handleClickRightButton = useCallback(() => {
  resolveRef.current(true);
  handleClose();
}, []);

// 사용 시
const confirmResult = await showOpenModal();
if (confirmResult) {
  // confirm인 경우 동작
} else {
  // confirm이 아닌 경우 동작
}

이 방식은 confirmResult에 따라 동작하는 방식을 달리하는 코드를 구현했다
내가 구현한다면 onConfirm에 실행할 함수를 전달하도록 할 것 같다

profile
움직이는 만큼 행복해진다
post-custom-banner

0개의 댓글