vue의 v-for를 사용하여 2차원 배열을 탐색하는 방법

이번에는 vue의 v-for를 사용하여 2차원 배열을 탐색하는 방법을 보여드리겠습니다. v-for를 사용하여 2차원 배열을 탐색할 때 주의사항은 무엇인가요? 살펴보자.

는 다음과 같습니다.

<table cellpadding="0" cellspacing="0" class="clearfix bigTable" id=&#39;downloaddata&#39;>
   <tr v-for=&#39;(item, index) in data&#39;>
    <template v-for=&#39;items in item&#39;>
     <template v-for=&#39;(itemss, indexs) in items&#39; v-if=&#39;indexs !== "type"&#39;>
      <td>{{itemss}}</td>
     </template>
    </template>
   </tr>

그 중 데이터 데이터는

this.data = [
   [
    {
     type: '',
     name: '资产',
     start: '期末余额',
     end: '期初余额'
    },
    {
     type: '',
     name: '负债和所有者权益(或股东权益）',
     start: '期末余额',
     end: '期初余额'
    }
   ],
   [
    {
     type: '',
     name: '资产',
     start: 125000,
     end: 12534567
    },
    {
     type: '',
     name: '负债',
     start: 125000,
     end: 12534567
    }
   ],
   [
    {
     type: '资产',
     name: '货币资金',
     start: 125000,
     end: 12534567
    },
    {
     type: '负债',
     name: '应付短期融资款',
     start: 125000,
     end: 12534567
    }
   ],
   [
    {
     type: '资产',
     name: '其中：客户存款',
     start: 125000,
     end: 12534567
    },
    {
     type: '',
     name: '所有者权益（或股东权益)',
     start: 125000,
     end: 12534567
    }
   ],
   [
    {
     type: '资产',
     name: '',
     start: '',
     end: ''
    },
    {
     type: '所有者权益（或股东权益',
     name: '实收资本（或股本）',
     start: 125000,
     end: 12534567
    }
   ],
   [
    {
     type: '资产',
     name: '资产总计',
     start: 111,
     end: 11
    },
    {
     type: '所有者权益（或股东权益',
     name: '资本公积',
     start: 125000,
     end: 12534567
    }
   ]
  ]

결과:

케이스를 읽으신 후 방법을 마스터하신 것 같습니다. 안으로 이 기사에 오셔서 더 흥미로운 정보를 얻으세요. PHP 중국어 웹사이트에서 다른 관련 기사도 주목하세요!

추천 자료:

vue 요청 데이터의 값을 수정하는 방법

JQuery가 선택 구성 요소에 지정된 값을 선택하는 방법

위 내용은 vue의 v-for를 사용하여 2차원 배열을 탐색하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!