How to start a v-for loop at a specific index.
example: A array given array = [a,b,c,d,e,f];
I want use v-for loop which will start looping from 3rd element. Thank you :)
Just use standard slice method:
new Vue({
el: '#app',
data: {
items: [
'aaa',
'bbb',
'ccc',
'ddd',
'eee',
'fff'
]
}
})<script src=https://unpkg.com/[email protected]/dist/vue.min.js></script>
<div id=app>
<ul>
<li v-for=item in items.slice(2)>{{ item }}</li>
</ul>
</div>PS: Or v-for with v-if:
new Vue({
el: '#app',
data: {
items: [
'aaa',
'bbb',
'ccc',
'ddd',
'eee',
'fff'
]
}
})<script src=https://unpkg.com/[email protected]/dist/vue.min.js></script>
<div id=app>
<ul>
<li v-for=(item, index) in items v-if=index >= 2>{{ item }}</li>
</ul>
</div>Or with custom function:
new Vue({
el: '#app',
data: {
items: [
'aaa',
'bbb',
'ccc',
'ddd',
'eee',
'fff'
]
},
methods: {
startFrom (arr, idx) {
return arr.slice(idx)
}
}
})<script src=https://unpkg.com/[email protected]/dist/vue.min.js></script>
<div id=app>
<ul>
<li v-for=item in startFrom(items, 2)>{{ item }}</li>
</ul>
</div>
