반응형 Vue.js조건1 Vue.js 강좌 심화 배열 다루기 조건, 반복 디렉티브 v-if, v-for 12 Vue.js 강좌 심화 배열 다루기 조건, 반복 디렉티브 v-if, v-for 12 많은 양의 데이터를 반복 표시하는 방법으로 테이블로 만들어 본다. 유명한 축구 5개국의 최근 4년간 피파랭킹 순위를 배열로 선언, 테이블로 표현하는 예제다. 소스 Vue.js 강좌 심화 배열 다루기 조건, 반복 디렉티브 v-if, v-for 12 피파랭킹 {{ header }} {{ country }} 실행 결과 설명 1. 테이블 헤더 부분은 v-for=header in headers로 만들었다. 테이블의 상단 제목이다. 2. 테이블의 내용을 1행씩 반복하는 데이터를 v-for="line in ranking"으로 하나씩 뺐으며 3. 익명 변수 line을 다시 v-for="country in line" 으로 각 행별 데이터.. 2022. 12. 28. 이전 1 다음 반응형