How to use vue to change the background-color of every second element of the list?

Question

Vue.js

I draw the list using v-for. The background of every second element should be a different color. I don't understand how to do it. After all, if you immediately bind the style, then each element will have such a background.

I thought to specify a key with a value of 0 in data, and for every second element to specify a background if this parameter is equal to 1, but how to change the parameter?

Answer 1

Display the elements through v-for="(item,i) in items" (i is the index, we will check the remainder of the division by 2, i.e. is the number a pair)
Then each check :class="i % 2 === 0 ? 'active' : '' "
And in the styles of the element with the active class (replace with the one you need) write the background)

Answer 2

Keep it simple, do it with css, :nth-child(even)