How to properly render lists of 3 in vue js?

Question

Vue.js

Good afternoon.
Let's say I have JSON like this:

[
{
    "id": 1,
    "brand": "adidas",
},
{
    "id": 2,
    "brand": "nike",
},
{
    "id": 3,
    "brand": "puma",
},
]

Etc.

I want to achieve such rendering so that there are 3 separately rendered elements in each row, and so on. and also each line was drawn through v-for


Please tell me how to achieve such a result

Answer 1

remove the Vue tag as your issue is not a VueJS issue.
Read about flex'y, grid'y. Should help.

Answer 2

We just break the array into chunks of 3 elements and output. We break it down as you like, at least this way .