SweetAlert2 관련 질문입니다.

Question

- 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요! - 먼저 유사한 질문이 있었는지 검색해보세요. - 서로 예의를 지키며 존중하는 문화를 만들어가요. - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요. 안녕하세요! 저는 아래의 SweetAlert을 사용하고 싶은데, 여러번 시도해 보았지만 방법을 모르겠습니다. Custom animation with Animate.css Try it on CodePen CSS body { font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif; } JS Swal.fire({ title: 'Custom animation with Animate.css', showClass: { popup: 'animate__animated animate__fadeInDown' }, hideClass: { popup: 'animate__animated animate__fadeOutUp' } })

realprogrammers · Answer

ShowClass, hideClass 사용하지 마시고, sweetalert2 기본 예제 보시고 용도에 맞게 사용해 보세요

jusanamsan33 · Answer

강사님 말씀대로 하였으나, 오히려 더 정적인 SweetAlert창이 나왔습니다. 혹시 제가 잘 못한 곳을 알 수 있을까요? methods : { saveUserInfo () { if ( this . name === '' ) { return this . $swal ({ title : '사용자 이름을 입력하세요.' , showClass : { popup : 'animate__animated animate__fadeInDown' }, hideClass : { popup : 'animate__animated animate__fadeOutUp' } }) }

jusanamsan33 · Answer

이렇게나 빨리 상담해주시다니, 대단히 감사합니다!! __()__

realprogrammers · Answer

main.js 파일에 다음과 같이 vue용 sweetalert2를 추가하세요 import VueSweetalert2 from 'vue-sweetalert2' import 'sweetalert2/dist/sweetalert2.min.css' app . use ( VueSweetalert2 ) 그리고 실제 사용하는 곳에서는 아래와 같이 this.$swal 로 사용하셔야 합니다. this . $swal();