实现一个基于策略模式的表单校验

最近项目居然要求不能使用vue cli这种工程化极度成熟的开发方案,非常痛苦的继承了上一代的gulp打包。苦哈哈!这也就导致不能使用ts,babel的兼容处理更是极少极少的,写啥都是得想一下,特别是没有箭头函数,this的指向我都bind了不知道多少次了。这次的功能里有一个表单校验的需求,所以我想着封装一个小工具来提高书写代码的流畅度,加上之前就一直想写一个基于策略模式的实际实现,这次赶巧给碰上了。东西比较多就不直接贴代码了,我上传到github仓库了,有兴趣去看看。github:CustomValidator效果演示

407 5 0
实现一个基于策略模式的表单校验

实现一个自定义虚拟滚动条

根据element框架的el-scrollbar来实现的,根据官方源码自己写了一版,用于了解该功能的实现。要点:通过margin的负值以及不定宽高的父级元素verflow: hidden实现隐藏滚动条真实的滚动条被隐藏后实现一个自己的滚动条(点击滚动滑轨滚动和拖拽滑块滚动)实现一个div的resize事件监听来动态更新虚拟滚动条的大小其中最难的就是拖拽滑块滚动,那个算法真的看不懂,反正照抄了,由于不是很有时间研究,所以没有对移动端的touch事件进行兼容。参考文章: Element-ui el-scrollbar 源码解析本人仓库:CustomScrollBar效果展示:总结:个人的实现...

302 0 0
实现一个自定义虚拟滚动条

url文件的下载

前言以前写过一篇《目前前端下载文件的最佳实践》的文章,虽然这个文章是我经过工作实践得出得,但是直到今天我才发现,原来不止如此,根据我目前的知识,可以把文件下载分为两类:接口返回文件流文件下载地址之前分析的文章仔细一想,其实都在做一个事情:读取文件流再手动转文件进行本地下载首先我们需要知道,我们的a链接下载其实并没有问题,本来是不需要读取文件流的,但是后端对头信息的了解不多,导致下载文件的链接是一个预览的头信息,这就导致我们a链接无法直接通过点击直接下载,反而是直接打开了这个文件。这带来的结果就是我们会认为图片啊,pdf这些浏览器可以直接打开的文件,并不会触发下载,而是预览,因为我们很少去...

423 1 0
url文件的下载

实现一个自动高度的输入框

前言大概在上个月的时候我就看了对应的一些资料,但是一直拖着,因为这个功能其实vue的框架就有提供,比如element ui的input组件,它的这个功能叫自适应文本域,属性为autosize。所以本文也不过多讲解具体实现,主要还是它的原理层的东西。这个功能可以用在哪呢?比如移动端的聊天输入框的高度判断,拿我们的QQ来讲,在没有内容的时候它就只有1行的高度,如果内容过高,就会自动变高,然后也会有一个max的最大高度阈值,这个高度一般是几行,比如最大6行高度,多了就滚动条处理。那么就开始吧!最基本的实现变高原理其实非常简单,假设我现在有一个textarea元素用于用户的输入,然后我希望它在用...

445 0 0
实现一个自动高度的输入框

为什么length不准

前言这个问题在最近经常被刷到,虽然我知道怎么解决这个问题,但是为什么会这样,其实并不太明白,所以这次特此开一篇文章讲讲为什么length获取字符位数会不准的问题,以及我们的解决办法。"𠮷".length //2 "💩".length //2𠮷与吉利的吉是一个意思,𠮷是异体写法,古文中会出现。按照我们的认知,上述的length输出应该是1才对,但事实上却是2。计算机是如何存储字符的早期的ASCII字符集在计算机中,所有的数据存储最终都是二进制,如何正确的存储及其识别字符,做法就是定制一个编码规则,让每个字符都由一个个数字来表示,这些数字被...

411 1 0
为什么length不准

了解前端的复制功能

前言前端的复制功能第一次使用的时候还记忆犹新,那时根本不知道怎么操作,复制它到底是怎么实现的,该怎么去触发,百度查看了不知道多少所谓的复制功能文档,每篇都有不一样的用法,我总想着有一天能搞清楚这些,毕竟现在复制功能已经web功能开发中离不开了。execCommand API浏览器在document对象上暴露了execCommand方法,该方法允许使用者通过输入“命令”的方式来操作 可编辑内容区域 的元素。可编辑内容区域被官方认为是contenteditable="true"的html元素,但按道理,input这些应该也是算可编辑内容区域的。这些都不重要,我们这次关注的...

535 0 0
了解前端的复制功能

uuid

什么是uuidUUID 是 通用唯一识别码(Universally Unique Identifier)的缩写,其目的,是让分布式系统中的所有元素,都能有唯一的辨识信息,而不需要通过中央控制端来做辨识信息的指定。如此一来,每个人都可以创建不与其它人冲突的UUID。uuid是指在一台机器上生成的数字,它保证对在同一时空中的所有机器都是唯一的说白了就是生成唯一标识符的作用,那么它的重复几率就一定要极低。每秒产生10亿笔UUID,100年后只产生一次重复的机率是50%。如果地球上每个人都各有6亿笔UUID,发生一次重复的机率是50%所以我们在日常使用中,可以不用考虑重复性的问题,几率非常非常小...

500 0 0
加载中