V-for styles individual elements

v-forts styles for individual elements
v-formponent 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 as needs to be individually styled sequence, when the I render time and itemIndex is equal, this component will be separately set a : style = 'chosenStyle' , can achieve the corresponding effect.


Read More: