vue v-if 사용시 div,span... 등 안나오게 사용하기 DEV / WEB
2019-11-13 posted by sang12
Vue를 사용 할 때 v-if를 <span v-if="true"><p>hello world</p></span> 형태로 사용해 왔었다.
그러다 보면 Vue가 뱉어낸 html 소스에 무분별한 div, span등이 활개치고 다니는 모습을 볼 수 있다.
처음 Vue를 적용하다 보니 신경 안쓰고 개발하다가, 꼭 태그들이 나와야되나..? 라는 생각이 들어 검색해보니 해결방법이 있었다.
왜 이제서야 이런 생각이 들었나.. 아래와 같이 작성해보고 뱉어낸 html 소스를 보면 그 차이를 알 수 있다.
-vue
<template v-if="true"><p>hello world</p></template>
<div v-if="true"><p>hello world</p></div>
-html
<p>hello world</p>
<div><p>hello world</p></div>
#vue js v-if span
#vue js v-if div
#vue js v-if not span
#vue js v-if not div
#vue v-if
REPLY