进行循环时，如何在Vue Js中显示特定的数字范围? [英] How to display specific range of number in Vue Js when making a loop?

问题描述

循环时如何获取特定数字，在我的情况下，我只想获取 5 以上的数字或在我想要的范围内.

How can I get specific number when I make a loop, in my case I want only to get 5 and above numbers or within a range that I want.

<select name="" id="input" class="form-control" v-model="selectcompetitionyear">
    <option v-for="n in 8" :value="n">Previous {{n}} games</option>
</select>

结果应为

<select name="" id="input" class="form-control" v-model="selectcompetitionyear">
    <option value="5">Previous 5 games</option>
<option value="6">Previous 6 games</option>
<option value="7">Previous 7 games</option>
<option value="8">Previous 8 games</option>
</select>

推荐答案

这取决于用例，但是其中一种方法是:

It depends on use case, but one of methods would be:

var vm = new Vue({
el: '#app',
    data: {
        selectcompetitionyear:5
    },
    methods:{
        getNumbers:function(start,stop){
            return new Array(stop-start).fill(start).map((n,i)=>n+i);
        }
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.3/vue.min.js"></script>
<div id="app" class="l-container l-vPad--mid">
    <select name="" id="input" class="form-control" v-model="selectcompetitionyear">
    <option v-for="n in getNumbers(5,9)" :value="n">Previous {{n}} games</option>
</select>
</div>

这篇关于进行循环时，如何在Vue Js中显示特定的数字范围?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！