Today's/DevelopStory

[React] 미들웨어 사용 예시

Axis 2021. 7. 16. 00:14

서버와 통신을 할 때 비동기 작업을 수행하기 위해서 필요한 것이 미들웨어이다.

해당 예시에서는 미들웨어 패키지 중에서 thunk를 사용하였다.

const nickCheck = (id) => {
  return function (dispatch) {
    instance
      .post('/api/sign/nickname', { nickname: id })
      .then((res) => {
        dispatch(checkDup(true));
        window.alert('사용 가능한 아이디입니다.');
      })
      .catch((error) => {
        dispatch(checkDup(false));
        window.alert('이미 존재하는 아이디입니다.');
      });
  };
};

닉네임 중복 체크를 위해 서버와 통신하는 미들웨어를 간단히 작성하였다.