CODEWITHSUNDEEP
vue.jsvuejs2vuejs3
BinChanhKun
BinChanhKun

Reputation: 95

How to add id to items when using v-for in VueJS

I have a data table and when I render those records on the website, I will add ids to the elements, each element is a different id(id="item-first"), so what to do?

 <div class="" v-for="(item, index) in producthots" :key="index">
          <div
            :class="
              index % 2 == 0 ? 'product-item row-reverse' : 'product-item'
            "
          >

I want when rendered, each element will have an id object

Upvotes: 3

Views: 6384

Answers (1)

pedram
pedram

Reputation: 201

for adding id you can bind it as like as :src and :class, it would be like this :id look at the example below:

<div :id="'CollapseState' + index" aria-expanded="false" 
class="ChangeState bg-white collapse"></div>

I binded the id and also for making it uniq I added + index end of it so the short answer is below code:

:id="'CollapseState' + index"

Upvotes: 5

Related Questions