How to make increment variable in v-for vue js

user_4506033 0
Viewed 14498

I want make a increment variable inside v-for

This is my code in vuejs:

<tr v-for="(item,index) in vtype_all" :key="index" :set="incrementI = 0">
                <template v-for="item2 in data_tanggal1">
                    <td :key="item2.id" v-if="item2 == item.baseTanggal[incrementI].tanggal">{{item.baseTanggal[incrementI].hitc+'spasi'+incrementI}}</td>
                    <td :key="item2.id" v-if="item2 == item.baseTanggal[incrementI].tanggal">{{item.baseTanggal[incrementI].hith}}</td>
                    <td :key="item2.id" v-if="item2 != item.baseTanggal[incrementI].tanggal">0</td>
                    <td :key="item2.id" v-if="item2 != item.baseTanggal[incrementI].tanggal">0</td>
                    <template v-if="item2 == item.baseTanggal[incrementI].tanggal" :set="incrementI = incrementI+1"></template>
                </template>
                <td>{{ item.jumQty }}</td>
                <td>{{ item.jumHrg }}</td>
            </tr>

This is what I want (laravel blade):

@foreach($dataProduct['byVtype'] as $row)
        <?php $i=0; ?> <!--can insert variable -->
        <tr>
            <td>{{$row['detail'][0]['vgrp_product']}}</td>
            <td>{{$row['detail'][0]['ptype']}}</td>
            <td>{{$row['detail'][0]['vgrp_nominal']}}</td>
            <?php for($j=0;$j<count($dataProduct['byTanggal']);$j++) { ?>
                <?php if(isset($row['baseTanggal'][$i]['tanggal']) ){ ?>
                    @if($dataProduct['byTanggal'][$j] == $row['baseTanggal'][$i]['tanggal'])
                        <td>{{$row['baseTanggal'][$i]['hitc']}}</td>
                        <td>{{$row['baseTanggal'][$i]['hith']}}</td>
                        <?php $i++; ?> <!-- increment varible if condition true -->
                    @else
                        <td>0</td>
                        <td>0</td>
                    @endif
                <?php } ?>
            <?php } ?>
            <td>{{ $row['jumQty'] }}</td>
            <td>{{ $row['jumHrg'] }}</td>
        </tr>
    @endforeach

I already set increment $i but it still returns value 0, not the incremented value.

laravel-blade laravel vue.js javascript
1 Answers

Why don't you just use the index value (starts from 0) since you're incrementing by just 1, like so?

  {{item.baseTanggal[index]}}
  {{item.baseTanggal[index+1]}}

etc... You don't need a computed property here. Index is enough.

EDIT:

Try this then:

<tr v-for="(item,index) in vtype_all" :key="index">
  <template v-for="item2 in data_tanggal1">
      <div v-for="counter in 10" :key="counter"> // change to to the number you want
        <td :key="item2.id" v-if="item2 == item.baseTanggal[counter].tanggal">{{item.baseTanggal[counter].hitc}}</td>
      </div>
  </template>
  <td>{{ item.jumQty }}</td>
  <td>{{ item.jumHrg }}</td>
</tr>
user_75317400
Related