vue中退出循环的方法
forEach
forEach不能使用break和continue。return也无法退出循环。
使用break,会报错(报错信息:SyntaxError: Illegal break statement)。
使用continue,会报错(报错信息:SyntaxError: Illegal continue statement: no surrounding iteration statement)
使用return,只能跳出本次循环,并不能终止循环。
退出循环的方法:
1. 仍用 forEach:但加上try...catch...
try{
this.userList.forEach( u => {
if( u.username === "admin"){
alert("找到admin用户");
throw new Error("已找到,退出循环");
}
})
}catch(e){
console.log(e)
};
注意:此方法将退出循环,继续执行该函数内 循环后面的代码。
若想直接退出当前函数,catch里必须有return。即try{}catch(){...return}
2. 改用 for循环
for(let i=0;i<this.userList.length;i++){
if( this.userList[i].username === "admin"){
alert("找到admin用户");
break;
}
}
注意:此方法将退出循环,继续执行该函数内 循环后面的代码。
若想直接退出当前函数,将break改为return。
3. 改用 some( )
this.userList.some( u =>{
if( u.username === "admin"){
alert("找到admin用户");
return true;
}
})
注意:some只有循环内部return true才会退出循环,继续执行该函数内 循环后面的代码。
4. 改用 every( )
this.userList.every( u =>{
if( u.username === "admin"){
alert("找到admin用户");
return false;
}else{
return true;
})
注意:every只要循环内部return false就会退出循环,继续执行该函数内 循环后面的代码。
vue中退出循环的方法的更多相关文章
- vue中添加util公共方法&&ES6之import、export
vue中添加util公共方法&&ES6之import.export https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Re ...
- Vue中的循环以及修改差值表达式
0828自我总结 一.Vue中的循环 v-for 常见的4总情况 #第一种 <div v-for="item in items"></div> #第二种 & ...
- vue中mixins的使用方法和注意点(详)
mixins基础概况 vue中的解释是这样的,如果觉得语言枯燥的可以自行跳过嘿~ 混入 (mixins): 是一种分发 Vue 组件中可复用功能的非常灵活的方式.混入对象可以包含任意组件选项.当组件使 ...
- vue中 localStorage的使用方法(详解)
vue中实现本地储存的方法:localStorage,在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cooki ...
- Vue中导出Excel表格方法
本文记录一下在Vue中实现导出Excel表格的做法.参考度娘上各篇博客,最后实现功能 Excel表格,我的后端返回的是数据流,然后文件名是放进了content-disposition中,前端进行获取. ...
- vue中计算属性computed方法内传参
vue中computed计算属性无法直接进行传参 如果有传参数的需求比如说做数据筛选功能可以使用闭包函数(也叫匿名函数)实现 例如: 在上篇博客vue安装使用最后的成绩表练习中的过滤功能的实现: &l ...
- 第七十六篇:ref引用(在vue中引用Dom的方法)
好家伙, 引子: jQuery简化了程序员操作DOM的过程 vue 优势:MVVM 在vue中,程序员不需要操作DOM.程序员只需要把数据维护好即可!(数据驱动视图) 那么若要在vue中操作dom,这 ...
- 在Vue中关闭Eslint 的方法
在vue项目中关闭ESLint方法:找到 webpack.base.conf.js 将这些代码注释掉, { test: /\.(js|vue)$/, loader: 'eslint-loader', ...
- vue中引入awesomeswiper的方法以及编写轮播组件
1.先安装less-loader npm install less less-loader --save 2.再安装css-loader npm install css-loader --save 3 ...
- vue中动态循环model
vue动态循环model与angular有所不同,angular直接定义一个数组,然后传入循环列表的index即可. 而vue不仅需要定义一个数组,还需要通过接口读出循环的数组长度,然后在create ...
随机推荐
- Apsara Stack 技术百科 | 联结良性生态,筑千行百业的数字基石
简介:作为现今IT领域最重要的课题:基础设施云化,离不开与伙伴的携手合作,如何让云上解决方案能充分释放价值的同时形成一个相互依存的自循环生态系统,混合云君来跟你聊聊! 生态系统这个词在维基百科上 ...
- dotnet 5 的 bin 文件夹下的 ref 文件夹是做什么用的
本文来和大家聊聊在 dotnet 5 和 dotnet 6 或更高版本的 dotnet 构建完成,在 bin 文件夹下,输出的 ref 文件夹.在此文件夹里面,将会包含项目程序集同名的 dll 文件, ...
- dotnet 6 引用 NAudio 的旧版本构建不通过
本文告诉大家在使用 NAudio 的旧版本导致构建不通过问题,解决方法是升级到 1.10 或以上版本 在更新 dotnet 6 项目时,使用了 NAudio 的旧版本,构建失败,提示 MC1000 如 ...
- MSBuild 输出日志可视化工具 MSBuild Structured Log Viewer 简介
感谢 Vatsan Madhavan 小伙伴推荐的 MSBuild 输出日志可视化工具,这个工具可以使用漂亮的 WPF 界面预览 MSBuild 复杂的输出内容 这是一个完全开源的工具,请看 Kiri ...
- Unlink原理和一些手法
Unlink原理和一些手法 简单介绍一下unlink相关的知识 unlink是利用glibc malloc 的内存回收机制造成攻击的,核心就在于当两个free的堆块在物理上相邻时,会将他们合并,并将原 ...
- 第8讲 browse命令的使用技巧
第8讲 browse命令的使用技巧 1.浏览所有parts,使用技巧 选中工程文件*.dsn/Edit/Browse/Parts.列出工程中用到的所有元件,方便在画完原理图后,查看哪些元件没有编号或数 ...
- 深入了解 Java 字节码
1.1 什么是字节码? Java 在刚刚诞生之时曾经提出过一个非常著名的口号: "一次编写,到处运行(write once,run anywhere)",这句话充分表达了软件开发人 ...
- ruby中的Hash排序
参考: https://blog.csdn.net/xing102172/article/details/9163607 For example: h={'a'=>2, 'c'=>1, ' ...
- golang将切片或数组进行分组
例子一: golang 数组分割 需求:给定一个数组和一个正整数,要求把数组分割成多个正整数大小的数组,如果不够分,则最后一个数组分到剩余的所有元素. package main import ( &q ...
- element Tree 树形控件
文档地址 https://element.eleme.cn/#/zh-CN/component/tree 代码地址 https://gitee.com/wBekvam/vue-shop-admin/b ...