Home > Article > Web Front-end > How to traverse a two-dimensional array using v-for in vue

How to traverse a two-dimensional array using v-for in vue

亚连Original: 2018-05-31 17:35:015558browse

Below I will share with you a method of using v-for in vue to traverse a two-dimensional array. It has a good reference value and I hope it will be helpful to everyone.

is as follows:

<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>

Among them, the data data is:

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

Result:

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

Commonly used request method aliases based on Axios (detailed explanation)

data-[*] in Bootstrap Arrangement of attributes

vue2.0 Style change display method based on status value

The above is the detailed content of How to traverse a two-dimensional array using v-for in vue. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Data grouping example of v-for in VueNext article：Data grouping example of v-for in Vue

See more

How to traverse a two-dimensional array using v-for in vue

Related articles