v-for
ts styles for individual elements
v-for
mponent can loop through a bunch of components. However, when styling, there is a need for individual elements to be styled in such a way that they are highlighted.
<card-grid
style="width:25%; text-align: center"
v-for="(item,i) in menuItems"
:key="i"
ref="items"
:style="i === itemIndex ?chosenStyle:'' "
>
{{ item.name }}
</card-grid>
itemIndex code> as needs to be individually styled sequence, when the
I code> render time and
itemIndex code> is equal, this component will be separately set a
: style = 'chosenStyle' code>, can achieve the corresponding effect.