4 donggua_123

尚未进行身份认证

我要认证

暂无相关简介

等级
TA的排名 3w+

浏览器原理学习--Chrome架构略谈

“js是一门单线程的语言”。这是初级前端都知道的一个最基本的知识点,虽然看起来平淡无奇的一个知识点,但以此为入口就会学到更多的知识点首先解释一下为什么js会被设计成单线程:这主要还是由于js是运行的环境和功能所决定的。js是运行在浏览器环境下,给前端用户提供操作页面元素,也就是DOM的一门语言。如果两段js代码同时运行在两个不同的线程上,对DOM做完全相反的操作,那浏览器就不知道该听谁的了,就会让用户很疑惑。为了避免复杂性,就设计成单线程的了。一个线程可以理解为完成一个逻辑功能的运行实例,把哪一块逻

2020-05-13 20:36:42

vue项目中动态创建模块以满足客户定制化需求的解决方案

前端项目中很多时候会遇到这样的业务需求:所有的客户都有共同的一些业务需求,即基础需求 基础需求需要根据业务发展进行升级 在共同需求的基础上,每个客户又有不同的需求(客制化)如果只是一两个客户还好,在基础版本上分两份前端文件,分别维护。但是客户达到一定数量级后,比如5个、8个甚至更多,这时候这种机械的本办法就费时耗力了,如果再考虑到基础功能的版本升级需求,那这种方法就完全不行了(升级一个基础功能就要分别复制到每个客户的项目中,同步代码)。以上情况就是我司的实际情况,下面介绍一下我司用的方法,不一

2020-05-12 22:13:28

element-ui中select下拉框加载大数据渲染优化

现在的前端项目中对于element-ui的使用几乎已经是一个常规动作了,但是组件库中的ui组件不一定都能满足实际场景的需求,比如今天要讲的select下拉框选择组件。我们公司是做证券行业基础设施的,股票和证券的数量动不动就是上千,当使用select渲染的时候就会很有压力,我司大致3000条数据,全部渲染出来大致需要4s左右,并且多选模式时,选中和反选时会明显感觉卡顿,这在体验上是觉得不能接受的...

2020-04-27 20:40:44

vue项目中画出优雅的线条(虚线、直线、折线、带箭头、流动效果等)

需求:运行监控图模块,模块之间用虚线或者实线连接,且带有箭头实现方法:1、canvas绘制2、echarts专业的表格软件(画带箭头的虚线有难度)3、svg方法4、leader-line插件5、背景图刚开始项目比较紧急,也没时间研究怎么划线比较好,就用了最笨的方法:背景图。就是让ui出一张背景图,只留下线条和背景色,其它元素的位置通过配置数据来动态渲染 ...

2020-03-18 17:27:17

for...in和for...of的区别和使用场景

这还要从一道面试题说起,请问下面两种情况分别打印什么:let arr = [1,2,3,4,5]for(let i in arr) { console.log(i) // 0,1,2,3,4} for(let i of arr) { console.log(i) // 1,2,3,4,5}可以看到,for in遍历的是数组索引,也是数组的键,for of遍历的...

2019-12-22 11:12:20

js线程和事件循环原理

先看一个案例:console.log(1)setTimeout(() => { console.log(2) new Promise((resolve) => { console.log(3) resolve(4) }).then(res => { console.log(res) })},...

2019-12-15 20:36:11

vue中二次封装axios请求,支持url参数拼接、blob数据流和formdata上传等

现在vue项目基本上都是使用axios进行请求操作,但是axios有时候并不能完全满足业务的需求,因为官方axios只支持一些比较规则的请求参数和方式,比如body类型的post,params类型的get。而实际业务中后台给的接口可不会那么如你所愿的规范,当后台同事肆意挥洒,尽情装逼,完全是即兴发挥,不考虑前端感受的时候,往往给出来的api接口是很变态的:get方法的url后面拼接参数...

2019-11-24 16:47:24

几个javascript代码相关的简洁优化方法

1、条件判断Array.includes()这是业务中最常见的情景之一看代码:function isOk(color) { if(color=== 'red' || color === 'yellow') { return true; }else { return false; }}一个简单的条件判断,如果判断条件较少时,...

2019-11-12 16:32:41

移动端H5下载文件

前段时间遇到一个需求,需要在H5页面中增加下载文件按钮,下载一个压缩文件,第一个想到的当然是最普遍和常用的方法:动态生成a标签,把链接地址给到href属性,触发一个click事件,完美下载。于是撸起袖子就开干。由于文件数据是通过接口请求回来的数据流,application/octet-stream类型,需要转换一下来使用: download() { ...

2019-11-12 11:27:16

vue-draggable-resizable定制化可拖动控件

最近遇到一个需求:前端定制化生成合同模板,生成时可以在指定位置拖放指定的控件,可动态编辑指定控件的属性和位置,最后将控件的位置等属性传给后台,后续使用模板签署合同时,乙方可在模板上指定位置签署。点击左边控件列表=》添加控件到文件上=》点击文件上的控件激活该控件=》编辑该控件的相关字段=》提交数据控件类型有多种,支持多个控件同时添加,文本类型支持长宽拉伸设置刚好有一个很好用的v...

2019-10-15 22:22:24

vue根据权限动态渲染按钮、组件等的函数式组件实现方式

前端工作中对于权限的需求是难免的,最近项目中就有这样的需求了。后台管理员可以新增前台成员,不通的成员具有不同的权限,有权限的人员可以看到一些操作按钮或者数据列表,反之则看不到。那么也就是说,前端需要根据登录用户的权限来渲染指定的dom。1、components文件下新建authorized文件夹,文件夹下新建auth.js校验权限const checkAuth = (authNa...

2019-10-03 15:58:10

vue-extend和vue-component注册一个全局组件

extend()是一个全局构造器,生成的是一个还没挂载到页面元素上的组件实例。在全局挂载插件的形式全局注册,就需要用到vue.use()方法,官方文档:所以插件必须是一个对象,并且提供install方法,注册的时候自动调用该方法。所以组件的写作步骤就清晰了一些了,实践出真知,现在就来练习一下写一个简约版的全局alert弹框1、在components文件夹下新建alert文件夹,...

2019-10-03 11:23:09

vue中使用element-ui,重复点击按钮或多个请求同时报错时弹出多个message弹框解决方法

项目中使用element-ui时,message弹框功能是必须使用的,有时会在点击按钮时提示无权限,或者请求报错时给出适当提示:但是重复点击按钮或者同一个页面多个请求同时报错时,就不美观了可以看到,element-ui是动态往页面根节点插入message元素来实现弹框效果的,都拥有el-message属性那么我们就可以通过判断页面中message的个数来决定要不要弹出第...

2019-09-24 16:04:33

css实现文字自定义下划线

1、文字下划线的实现可以使用原生api:text-decoration:underline.words{ font-size: 22px; text-decoration: underline;}但是没法调整下划线和文字的间距,太贴文字了也不好看2、于是就有了第二种方法:边框法,就是利用元素的下边框实现下划线的效果,还可以通过line-height调节距离...

2019-09-20 15:47:29

前端js下载文件压缩包

工作当中时常会遇到对文件的一些处理,比如下载表格、下载图片、下载文件等,这里说一种下载压缩包的方法。其实也很简单,需要用到一款插件jszip,官方用法都是有的:https://www.npmjs.com/package/jszip可以直接引入脚本:<script src='./jszip.js'></script>也可以在vue项目中直接安装,运行:...

2019-09-20 10:03:20

文件预览或下载中,axios设置responseType:blob时对于后台报错信息的捕获兼容

项目中难免会遇到预览文件或者下载文件的场景,如果后台返回的是base64或者图片格式还好说,文件信息直接放在返回body里,作为对象属性给到前端,很直观,也方便取用。但后台给到的是文件流就要麻烦一些了,一般来说文件流会直接凡在res.data里处理这种特殊返回值时需要设置axios的responseType为blob,防止axios内部默认处理返回值,导致无法解析:axios.g...

2019-09-01 16:58:06

vue不用window的方式刷新当前页面

vue项目中我们很多时候需要刷新页面,比如本地用户信息更新后,或者需要重新加载当前页面的数据时,使用window.location.reload()或者window.history.go(0)方法都是整个窗口的刷新,和h5快捷键一样,会有短暂空白出现,体验很不好,这里说两种在vue项目里使用的无感知刷新页面方法:一、provide/inject方法父组件中provide提供的属性可以在任何...

2019-05-20 21:38:50

H5项目中有滚动元素,ios系统拖动默认行为和滚动事件冲突解决

问题:h5页面,在ios系统中,拖动顶部固定元素(红色区域)时,会默认拖动整个浏览器,导致出现白色背景,影响到自定义的滚动事件(橙色区域),因为自定义滚动是用了ui框架的,会导致其短暂的无法滚动,必须要等整个页面停稳了才能滚动橙色区域,影响到体验。这应该是ios系统自带的缓动效果,当用户拖动页面元素时给了一个回弹吸顶的效果,显得更加柔和,但有时候我们是不需要的。想要的效果:到顶后继续向下滑...

2019-05-04 18:07:15

作用域和闭包

一说到javascript里的闭包,大部分人都好像有所耳闻,但又说不太清楚到底是个什么东西。那么闭包到底是何方神圣呢?闭包是javascript中非常常见,但是又非常神秘的一个概念,有多少人像我一样,看了好多关于闭包的技术文章,却始终没能彻底搞懂闭包的深层次原理,经常是面试前突击一下闭包相关的文章,似懂非懂,过段时间后又几乎全忘了,只留下些残破的似是而非的记忆。今天我尝试着来总结一下我自己...

2019-04-11 21:10:06

vue组件通信方式小结

vue项目中,组件间的通信是最常用到的,也是面试必问的问题之一。组件通信可以分为几种类型:1、父子通信 1.1 父传子 1.2 子传父2、跨级传递 2.1祖父传孙 3.1孙传祖父3、同级组件间通信首先说一下通用的方式,即不管哪种场景都在功能上可以实现,撇开具体场景的适合程度,其实也就是全局的通信方式。一、vue bus 以vue实例为总线,...

2019-04-01 22:34:00

查看更多

勋章 我的勋章
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv1
    勤写标兵Lv1
    授予每个自然周发布1篇到3篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。