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 ...
随机推荐
- 阿里云全站加速DCDN重磅发布!打造新一代加速引擎
简介: 新一代的加速引擎DCDN,安全.高效.可计算 在数字化转型变革逐步深入的当下,安全高效成为企业上云.全球化部署的关键需求. 随着应用场景复杂度不断提升.业务需求差异化发展,为了给企业提供更完善 ...
- 行业实战 | 5G+边缘计算+“自由视角” 让体育赛事更畅快
简介: 世界本是多维的.进入5G时代,观众对多维度视觉体验的需求日益增长,5G MEC网络与边缘计算的结合,具备大带宽.低延迟特性,使视频多维视觉呈现成为现实.在第二十三届CUBA中国大学生篮球联赛期 ...
- 简单、有效、全面的Kubernetes监控方案
简介:近年来,Kubernetes作为众多公司云原生改造的首选容器化编排平台,越来越多的开发和运维工作都围绕Kubernetes展开,保证Kubernetes的稳定性和可用性是最基础的需求,而这其中 ...
- 如何开发 Node.js Native Add-on?
简介: 来一起为 Node.js 的 add-on 生态做贡献吧~ 作者 | 吴成忠(昭朗) 这篇文章是由 Chengzhong Wu (@legendecas),Gabriel Schulhof ( ...
- [PHP] Laravel 获取模型/表的所有字段
获取指定表的所有字段名: use Illuminate\Support\Facades\Schema; // 表名不带前缀 $columns = Schema::getColumnListing( ...
- dotnet 读 WPF 源代码笔记 GlyphRun 的 DeviceFontName 的功能是什么
在 WPF 里面的 GlyphRun 里,有一个令人迷惑的 DeviceFontName 属性,似乎给这个属性传入什么值,结果都不会有变更.通过阅读源代码,可以了解到,这是一个没什么用途的属性.本文将 ...
- dotnet C# 如果在构造函数抛出异常 是否可以拿到对象赋值的变量
如果使用某个变量去获取某个类型的对象创建,但是在这个类型的构造函数调用时抛出异常,请问此变量是否可以拿到对应的对象 如下面代码 private void F1() { Foo foo = null; ...
- 2019-10-18-C#-判断系统版本
title author date CreateTime categories C# 判断系统版本 lindexi 2019-10-18 15:2:0 +0800 2018-03-08 17:34:3 ...
- SpringBoot使用JSch操作Linux
推荐使用Hutool的Jsch工具包(它用的连接池的技术) 一.SSH远程连接服务器 SSH更多见:http://t.csdnimg.cn/PrsNv 推荐连接工具:FinalShell.Xshell ...
- SAP集成技术(八)成熟度模型
成熟度模型的目的在于使用模型和标准来评估当前的集成能力,并确定必须建立哪些能力,以达到期望的成熟度级别. 成熟度级别描述了一个特定主题复杂性对于某种方法或模型的成熟度.基于定义的需求和标准的分类,得出 ...