Tatanic

aro9515·2021년 12월 17일
0

vue.js

목록 보기
8/30

v-for
반복문 사용

<h4>survived</h4>
        <table border="1">
            <thead>                
                <tr>
                    <th v-for="tmp in tHead.fields" v-bind:key="tmp" >
                        {{tmp.name}}                
                    </th>
                </tr>
            </thead>

            <tbody>                
                <tr v-for="tmp in tBody.survived" v-bind:key="tmp">
                    <td v-for="tmp2 in 7" v-bind:key="tmp2">
                <!-- 어짜피 td에 들어가는 반복문이기때문에 td에 넣고, 새로운 tmp1을 정의 해서 사용한다. 해결! -->
                        {{tmp[tmp2-1]}} <!-- tmp1 = 1,2,3,4,5,6,7 이기때문에 -1 을 붙여준다. -->
                    </td>                    
                    <!-- <td>{{tmp[0]}}</td>
                    <td>{{tmp[1]}}</td>
                    <td>{{tmp[2]}}</td>
                    <td>{{tmp[3]}}</td>
                    <td>{{tmp[4]}}</td>
                    <td>{{tmp[5]}}</td>
                    <td>{{tmp[6]}}</td>  // 반복문을 통해서 이걸 다 줄임-->
                </tr>                
            </tbody>
        </table>
profile
The best

0개의 댓글