Programing Language/React.js
React) react-toastify 중복 실행 방지하기
Jude_Song
2023. 3. 12. 17:05
728x90
반응형
import { ToastContainer, toast } from 'react-toastify';
const autoCloseDuration = 1000;
const toastId = 'current-toast-id'; // <- 고정값 id 지정
export const showToast = (msg: string) => {
if(!toast.isActive(toastId)){ //isActive로 활성여부 체크
// 중복 실행 방지하기 위해서 고정된 id를 넣는다.
toast(msg, {
toastId: toastId,
position: 'bottom-center',
autoClose: autoCloseDuration,
hideProgressBar: true,
closeButton: false,
pauseOnHover: true,
progress: undefined,
theme: 'dark'
});
}
};
export const Toast = () => {
return (
<ToastContainer limit={1} />
);
};
참고 https://fkhadra.github.io/react-toastify/prevent-duplicate/
728x90
반응형