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 ...
随机推荐
- 从0到1使用Webpack5 + React + TS构建标准化应用
简介: 本篇文章主要讲解如何从一个空目录开始,建立起一个基于webpack + react + typescript的标准化前端应用. 作者 | 刘皇逊(恪语)来源 | 阿里开发者公众号 前言 本篇文 ...
- 当 Knative 遇见 WebAssembly
简介: Knative 可以支持各种容器化的运行时环境,我们今天来探索一下利用 WebAssembly 技术作为一个新的 Serverless 运行时. 作者:易立 Knative 是在 Kubern ...
- Schedulerx2.0支持应用级别资源管理和任务优先级
1. 前言 Schedulerx2.0是一套分布式的任务调度+计算框架.作为一套分布式计算引擎,用户经常需要资源管理的需求,当前schedulerx仅仅支持单个任务实例的管控(比如单机子任务并发数.拉 ...
- 内含干货PPT下载|一站式数据管理DMS及最新解决方案发布
简介: 今天主要给大家介绍一站式数据管理平台DMS以及解决方案的发布.议题包含企业数据管理当前的一些痛,DMS一站式数据管理平台以及其核心技术,实时数仓解决方案以及相应的应用实践. "数聚 ...
- [GPT] 监测输入框被 js 设置了值 ?input 输入框被设置了 value 值,但是没有触发 change 事件?
1. input 输入框被设置了 value 值,但是没有触发 change 事件 ? 如果输入框的 value 值是通过 JavaScript 代码直接设置的,那么不会触发 change 事件,这是 ...
- dotnet 警惕 async void 线程顶层异常
在应用程序设计里面,不单是 dotnet 应用程序,绝大部分都会遵循让应用在出现未处理异常状态时终结的原则.在 dotnet 应用里面,如果一个线程顶层出现未捕获异常,则应用进程将会被认为出现异常状态 ...
- jqGrid--设置单元格字体颜色
colModel: [ { name: '列名称', index: '列名称', width: 65, sortable: true, resizable: false, cellattr: addC ...
- CF620E New Year Tree (线段树维护 dfs 序)
CF620E New Year Tree 题意:给出一棵 n 个节点的树,根节点为 1.每个节点上有一种颜色 ci.m 次操作.操作有两种: 1 u c:将以 u 为根的子树上的所有节点的颜色改为 ...
- 19、python 脚本
1.python 安装及配置 下载地址 python2 和 python3 共存安装 2.python 可视化 import turtle turtle.pensize(2) #画一个小圆 turtl ...
- 自定义Lua解析器管理器-------演化脚本V0.5
[3]自定义Lua解析器管理器-------演化脚本V0.5 方便我们在项目中使用Lua解析方法,我们封装管理一个lua解析器,管理LuaState的方法执行. 解析器脚本: using LuaInt ...