My vue component like this :
<template>
<div class="row">
<div class="col-md-3" v-for="item in items">
...
</div>
</div>
</template>
<script>
export default {
...
computed: {
items() {
...
}
},
...
}
</script>
If the loop complete, I want to call a statement or method
So the statement is executed when the loop completes
How can I do it?
Update :
From Kira San answer, I try like this :
<template>
<div class="row">
<div class="col-md-3" v-for="(item, key) in items" v-for-callback="{key: key, array: items, callback: callback}">
...
</div>
</div>
</template>
<script>
export default {
...
computed: {
items() {
const n = ...
return n
}
},
directives: {
forCallback(el, binding) {
let element = binding.value
if (element.key == element.array.length - 1)
if (typeof element.callback === 'function') {
element.callback()
}
}
},
methods: {
callback() {
console.log('v-for loop finished')
}
}
}
</script>
The console log not display
My items is object
If do console.log(n) in items, the result like this :
