For loop in vuejs like php

Question

It is possible in vuejs to v-for a loop like php?

I want this output:

<select>
    <option>2</option>
    <option>1</option>
    <option>0</option>
</select>

My code (ticket.quantity = 2):

<select>
    <option v-for="index in ticket.quantity" :value="index" :key="index">{{index}}</option>
</select>

My output:

<select>
    <option>2</option>
</select>

Nikola Pavicevic · Accepted Answer · 2022-06-13 19:15:11Z

1

You can try to loop ticket.quantity + 1 :

new Vue({
  el: '#demo',
  data() {
    return {
      ticket: {quantity: 2}
    }
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
  <select>
    <option v-for="(q, index) in ticket.quantity + 1" :value="index" :key="index">{{index}}</option>
  </select>
</div>

edited Jun 13, 2022 at 19:15

answered Jun 13, 2022 at 19:09

Nikola Pavicevic

23.6k9 gold badges30 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Ol D. Castor Over a year ago

this also works with vue2

Nikola Pavicevic Over a year ago

@Ol D. Castor hey mate, sure, take a look at snippet again now it's vue2 :)

user3666060 · Accepted Answer · 2022-06-14 09:01:08Z

0

The answer of Nikola didn't worked for me completely but I managed to solve it like this:

<select>
    <option value="0" selected>0</option>
    <option v-for="index in parseInt(ticket.quantity)" :value="index" :key="index">{{index}}</option>
</select>

answered Jun 14, 2022 at 9:01

user3666060

232 bronze badges

Collectives™ on Stack Overflow

For loop in vuejs like php

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related