103 vee-validate IE11에서 immediate 옵션 안줬는데 즉시 유효성 검사되는 이슈

source: categories/study/vue-experiance/vue-experiance_9-99_04.md

103 vee-validate IE11에서 immediate 옵션 안줬는데 즉시 유효성 검사되는 이슈

해결방법

  1. 브라우저 체크 (IE인지아닌지 체크)
  2. IE11이면 처음 input 이벤트 2번은 유효성 검사 안하도록 코드 작성
    • IE11은 페이지 처음 로드시 input 이벤트발생 <- 이거 처음 실행 방지
    • IE11은 input 태그에 마우스 포커싱만해도 input 이벤트 발생 <- 이거 두번째 input이벤트. 이거까지 방지
  3. 위 두번의 input 이벤트를 막고 그 다음부터 유효성 검사 실행되도록함
function checkInternetExplorer() {
	const agent = navigator.userAgent.toLowerCase();
	return (
		(navigator.appName === 'Netscape' &&
			navigator.userAgent.search('Trident') !== -1) ||
		agent.indexOf('msie') !== -1
	);
}

export default {
    data() {
        return {
            firstInputEvent: false,
            secondInputEvent: false,
            isInternetExplorer: checkInternetExplorer(),
        }
    },
    methods: {
        inputChange(e) {
            if (this.isInternetExplorer) {
                if (!this.firstInputEvent) {
                    this.firstInputEvent = true;
                    return;
                }
                if (!this.secondInputEvent) {
                    this.secondInputEvent = true;
                    return;
                }
            }
            
            // ...
        }
    }
}