本文主要通过实例代码给大家介绍了vue中的无限循环，代码简单易懂，非常不错，具有参考借鉴价值，需要的朋友参考下吧，希望能帮助到大家。
代码如下所示：
<template>
<p id="">
<ul v-for="(item,index) in listaaa">
<li v-if='dealfun(item.cdate,index)'>{{item.cdate}}</li>
</ul>
</p>
</template>
<script>
export default {
name: ,
data(){
return {
listaaa: [{
cdate: '123'
},
{
cdate: '456'
},
],
flagname: ''
}
},
methods: {
dealfun(arg, index) {
console.log('---------------------------')
if (arg == this.flagname) {
return false
} else {
this.flagname = arg
return true
}
}
},
}
</script>
<style scoped>
</style>
导致无限循环的原因：flagname改变导致视图更新，视图更新又导致 dealfun()函数不停执行，进而flagname再次更新；循环往复；
解决办法：（使用全局变量）
<template>
<p id="">
<ul v-for="(item,index) in listaaa">
<li v-if='dealfun(item.cdate,index)'>{{item.cdate}}</li>
</ul>
</p>
</template>
<script>
var flagname;
export default {
name: ,
data(){
return {
listaaa: [{
cdate: '123'
},
{
cdate: '456'
},
],
// flagname: ''
}
},
methods: {
dealfun(arg, index) {
console.log('---------------------------')
if (arg == flagname) {
return false
} else {
flagname = arg
return true
}
}
},
}
</script>
<style scoped>
</style>
相关推荐：
easyui tree树组件无限循环实例分析
实例讲解css3实现无限循环的无缝滚动
php实现无限循环获取mysql中数据的方法示例
以上就是vue中无限循环代码分享的详细内容。