VUE中的无限循环代码解析
更新时间：2017年09月22日 11:48:14 作者：weixin_38788947
本文通过实例代码给大家介绍了vue中的无限循环，代码简单易懂，非常不错，具有参考借鉴价值，需要的朋友参考下吧
代码如下所示：
<template>
<div id="">
<ul v-for="(item,index) in listaaa">
<li v-if='dealFun(item.cdate,index)'>{{item.cdate}}</li>
</ul>
</div>
</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>
<div id="">
<ul v-for="(item,index) in listaaa">
<li v-if='dealFun(item.cdate,index)'>{{item.cdate}}</li>
</ul>
</div>
</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>
总结
以上所述是小编给大家介绍的VUE中的无限循环代码解析，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
这篇文章主要介绍了vue自动化路由的实现代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-09-09
在vue中，使用watch来响应数据的变化。watch的用法大致有三种。下面代码是watch的一种简单的用法，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友参考下吧2018-11-11
Element-Plus el-col、el-row快速布局及使用方法
这篇文章主要介绍了Element-Plus el-col、el-row快速布局及使用方法,本文通过示例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-12-12
这篇文章主要介绍了vue全局组件和局部组件的写法，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-03-03
本篇文章主要介绍了vue滚动行为，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-09-09
今天小编就为大家分享一篇vuex实现数据状态持久化，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
vue3的setup语法如何自定义v-model为公用hooks
这篇文章主要介绍了vue3的setup语法如何自定义v-model为公用hooks，文章分为两个部分介绍，简单介绍vue3的setup语法如何自定义v-model和如何提取v-model语法作为一个公用hooks2022-07-07
这篇文章主要给大家介绍了关于axios不能使用Vue.use()的相关资料，文中通过示例代码介绍的非常详细，对大家的理解和学习具有一定的参考学习价值，需要的朋友可以参考借鉴，下面随着小编来一起学习学习吧。2018-01-01
这篇文章主要介绍了vue中的for循环以及自定义指令，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-08-08
这篇文章主要介绍了Vue.set()实现数据动态响应的相关知识，非常不错，具有参考借鉴价值,需要的朋友可以参考下2018-02-02
最新评论