v-if (2) 썸네일형 리스트형 [Vue3] 리스트 렌더링 (v-for) v-for 특징- alias in expression 형식의 특수 구문을 사용하여 반복되는 현재 요소에 대한 별칭(alias) 제공 {{ item.text }} - 배열에서 인덱스에 대한 별칭을 지정할 수 있음 {{ index }} / {{ item.name }} - 객체에서는 키, 인덱스에 대한 별칭을 지정할 수 있음 {{ index }} / {{ key }} / {{ value }} 여러 요소에 대한 v-for 적용- template 요소에 v-for을 적용하여 하나 이상의 요소에 반복 렌더링 할 수 있음 {{ item.name }} {{ item.age }} .. [Vue3] 조건부 렌더링 (v-if, v-show) v-if: 표현식 값의 T/F를 기반으로 요소를 조건부로 렌더링 - 'v-else' directive를 사용하여 v-if에 대한 else 블록을 나타낼 수 있다. true일때 보여요 false일때 보여요 토글 - 'v-else-if' directive를 사용하여 v-if에 대한 else if 블록을 나타낼 수 있다. Alice입니다 Bella입니다 Cathy입니다 아무도 아닙니다. 여러 요소에 대한 v-if 적용- v-if는 directive이기 때문에 단일 요소에만 연결 가능- template 요소에 v-if를 사용하여 하나 이상의 요소에 대해 적용할 수 있다. (v-else, v-else-.. 이전 1 다음