new Vue({
el: '#app',
data: {
list: [
{
name:123123123
}, {
name:1
}, {
name:1
}, {
name:1
}, {
name:1
}, {
name:1
}, {
name:1
}, {
name:1
}, {
name:1
}, {
name:1
}
]
}
})
<div id="app" class="box">
<ul class="list">
<li v-for="item in list">{{item.name}}</li>
</ul>
</div>
.box {
display: flex;
border: 1px solid red;
height: 100px;
}
.list {
display: flex;
flex-direction: column;
flex-wrap: wrap;
width: 100%;
}
li {
list-style: none;
min-width: 50%;
}