在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue v-for循環(huán)表格 希望第四個(gè)<th>或<td>

vue v-for循環(huán)表格 希望第四個(gè)<th>或<td>標(biāo)簽自動(dòng)換到下一行應(yīng)該怎么做?

<tr v-for="item in xxList">
    // 這里寫一個(gè) <td> 標(biāo)簽
    <td>{{item}}</td>
    // 那么如果有10個(gè) item 那么這10個(gè) item 就都在一行了
    // 希望一行只放 3 個(gè)應(yīng)該怎么做呢
    // 把 td 寬度設(shè)置為 33% 第四個(gè)也不會(huì)自動(dòng)換行 而是擠在同一行
</tr>

希望效果是這樣的:

clipboard.png

回答
編輯回答
瘋子范

可以把你的xxList變成[[A, B, C], [D, E, F]]的形式

<tr v-for="tr in xxList">
  <td v-for="td in tr">{{td}}</td>
</tr>
2018年9月19日 02:59
編輯回答
尐飯團(tuán)

我是小白,我覺得可能你需要把原始數(shù)據(jù)更改為二維數(shù)組再渲染

2018年3月10日 03:00
編輯回答
扯不斷

標(biāo)簽換掉。不要用表格 tr td

<div v-for="item in xxList" class="box">
    <div class="content">{{item}}</div>
</div>
.box{
    display: flex;
    flex-warp: wrap;
}
.content{
    width: 33%;
}
2017年2月11日 22:43