CODEWITHSUNDEEP
vue.js
Hendri Sildrian
Hendri Sildrian

Reputation: 95

How to call method in loop using vuejs

I already call method in v-for, it works. But I get

[Vue warn]: You may have an infinite update loop in a component render function.

How to solve this?

This is my code:

<tr v-for="(item,index) in all_data" :key="index">
    <td>{{ item.name }}</td>
    <td colspan="2">{{ toMakeLocalString(item.data_trx.total_penjualan) }}</td>
    <td>{{ roundDataPercentPerline(item.data_trx.total_penjualan,all_data_trx.penjualan) }}</td>
                            
     {{ resetVal() }}
     <template v-for="(itemBodyJum,indexBodyJum) in arrHeader">
         <template v-if="itemBodyJum == item.data_provider[incrementI].denom">
         <td :key="indexBodyJum+item.data_provider[incrementI].jumlah_trx">{{ toMakeLocalString(item.data_provider[incrementI].jumlah_trx) }}</td>
         {{ incVal(incrementI) }}
      </template>
      <template v-else>
         <td :key="indexBodyJum+index">0</td>
      </template> 
</tr>

My method:

incVal(val, flagcond) {
   console.log(this.flagInc+'---1')
   if(this.flagInc == false) {
      this.flagInc = true
      console.log(this.flagInc+'---2')
      this.incrementI = val + 1
   }
},
resetVal() {
  this.flagInc = false
  this.incrementI=0
}

Upvotes: 1

Views: 778

Answers (1)

IVO GELOV
IVO GELOV

Reputation: 14259

Your problem is that you change the incrementI variable during the V-FOR. Try to use something else instead - e.g. indexBodyJum or indexBodyPen.

Upvotes: 1

Related Questions