오늘도 개발자 Backend Developer

Vue + jquery 사용하면서 삽질한 경험 -1

문제

  • Vue.js와 jquery를 혼용해서 사용하지 않는 것이 좋다고 생각하나… 업무 중에 필요한 부분이 있어서 개발하던 중에 문제가 발생했다.
  • Vue.js의 mounted 내에 특정 dom에 jquery 이벤트를 바인딩함.
  • dom 을 못찾음…? 응???
  • html 상단을 보던 중 v-if를 발견….

해결법

  • v-show를 사용해야함(관련내용 : https://kr.vuejs.org/v2/guide/conditional.html#v-if-vs-v-show )
  • 요약 v-if렌더링하지 않음! v-show렌더링하고 css를 이용해서 display:none만 설정하므로, jquery 이벤트가 bind 됩니다.

결론

  • 역시 vue와 jquery…. 혼용해서 사용하는건 여러가지 고민이 필요하다… 안쓰는게 답인듯 하다 ㅠㅠ