
JavaScript
文章平均质量分 57
dk123sw
这个作者很懒,什么都没留下…
展开
-
React实现虚拟滚动列表
原理: 只渲染可视节点以减少DOM开销,提升加载速度以下代码是伪代码,具体实现看这如果你想在项目中使用复杂的虚拟滚动,可以看下react-virtualized。本文只提供虚拟列表实现思路实现步骤创建容器<div className="container"> <div className="virtual-container" /></div> .container { height: 200px; widt.原创 2021-04-09 14:59:33 · 1966 阅读 · 0 评论 -
前端面试之道总结
知识点太多,把重点拿出来硬性记住,注意面试时这个知识点会以怎样的形式提问!!重点判断数据类型typeof 、instanceoftypeof对于原始类型来说,除了null都可以显示正确的类型instanceof 内部机制是通过原型链来判断所以不能用于基本类型Object.prototype.toString.call() 对所有类型都可以判断Array.i...原创 2020-06-27 10:41:45 · 782 阅读 · 0 评论 -
IOS微信下问题2 页面滚动失效
建议先看这篇文章 (-webkit-overflow-scrolling:touch)下面 说一下点击其他区域,再在滚动区域滑动,滚动条无法滚动 这个bug问题复现:由非滚动区域向滚动区域滑动,再迅速滑动滚动区域,此时滚动会出现bug在一个可上下滑动的区域,滚动条在最上面再向上滑动或滚动条在最下面再向下滑,松手后立即滑动滚动区域,滚动出现bug ...原创 2020-01-11 13:12:06 · 883 阅读 · 0 评论 -
使用userAgent检测内核、平台、Windows 操作系统、移动设备..
使用代码来自JS高程设计第9章客户端检测方式: 能力检测:在编写代码之前先检测特定浏览器的能力。例如,脚本在调用某个函数之前,可能要先检测该函数是否存在。这种检测方法将开发人员从考虑具体的浏览器类型和版本中解放出来,让他们把注意力集中到相应的能力是否存在上。 怪癖检测:怪癖实际上是浏览器实现中存在的bug,怪癖检测通常涉及到运行一小段代码,通过代码检测系统方法是否是正常输出。...原创 2019-01-12 13:47:54 · 1318 阅读 · 0 评论 -
去除IOS微信下自带滚动回弹(橡皮筋效果)
先说结论: 可以去除滚动回弹,根据不同情况使用不同的方式。1.程序内没有滚动直接使用下面代码轻轻松松没毛病document.body.addEventListener('touchmove',function(e){ e.preventDefault() },{ passive: false })2.有滚动的情况下面是去掉微信自带的回弹的demo<!...原创 2019-12-03 22:25:07 · 3178 阅读 · 0 评论 -
js 串口通信
以下方式可实现利用IE 中 ActiveX、mscomm32.ocx控件进行串口通信,没记错的话在IE8之后ActiveX就不能用了。这里给三篇文章参考文章1、文章2、文章3 Nodejs服务端,可以使用SerialPort读写SerialPort说明 serialport官网 Chrome下,在chrome扩展程序和App中使用chrome.serial读写串口 中文官网除...原创 2019-09-06 17:56:59 · 6755 阅读 · 0 评论 -
原型、对象属性以及原型链
想了解实例、构造函数、原型之间的关系可以参考红宝书原型部分用一张别人那里拿的图表示每个函数都有一个prototype(原型)属性prototype属性是一个指向对象的指针,被指向的对象即是原型对象原型对象包含可以由特定类型的所有实例共享的属性和方法,简单说在原型对象上定义的属性方法在实例中是共享的最有意思的是在原型对象中会自动获得constructor(构造)属性,此属性...原创 2019-08-16 15:18:50 · 381 阅读 · 0 评论 -
js 更改对象中的属性名
网上大多是利用JSON转为字符串再进行替换修改属性名var bbb = JSON.parse(JSON.stringify(aaa).replace(/Name/g,"title"));这样做会有2个缺点,1.如果属性值匹配到会被更改 2.属性名中有部分匹配到也会被更改 如下: var aaa = [ { Nam...原创 2019-07-22 17:30:52 · 9617 阅读 · 1 评论 -
JS数组操作
栈方法:后进先出 push\pop从尾部添加\删除项队列方法:先进先出 unshift\shift 从头部添加\删除项 添加的方法返回改变后的数组长度,删除的方法返回删掉的值,改变原数组。重排序方法:sort(排序) array.sort()返回排序后的数组。改变原数组。可以接收一个比较函数作为参数,类似如下函数返回布尔值function compare(value1,...原创 2019-01-31 16:20:57 · 634 阅读 · 0 评论 -
js 吸顶实现
效果:第一种实现:使用DOM主要思路是根据实时监听滚动条被向下拉动的距离,当其距离顶端小于某一值时使用position: fixed 固定。核心代码 //获取距离页面顶端的距离 let titleTop = tit.offsetTop; //滚动事件 document.onscroll = function(){ ...原创 2018-12-06 11:13:55 · 2048 阅读 · 0 评论 -
制作一个简单React移动端滑动切换组件
写在前边本文主要介绍如何实现滑动切换及遇到的问题,具体组件在这如果你需要的是轮播图,这里有两个轮子react-slick、nuka-carousel原生DOM操作,非React框架下也能使用我们想实现触摸切换无非是做以下三件事监听触摸事件判断用户当前操作是否是切换进行页面切换获取触摸事件先了解触摸事件要想监听触摸事件整个流程需要监听以下三个事件let li...原创 2018-11-19 22:36:16 · 4972 阅读 · 0 评论 -
CSS限制单行多行
限制单行overflow:hidden;text-overflow:ellipsis;white-space:nowrap;限制多行overflow:hidden;text-overflow:ellipsis;display:-webkit-box;white-space:pre-wrap;-webkit-box-orient:vertical;-w...原创 2018-10-11 17:58:01 · 4083 阅读 · 0 评论 -
结合antd-mobile选择器的行政区三级联动组件
( 如果前面失效 链接: https://pan.baidu.com/s/1oqdihRVTknM_AdzX31oZzg 提取码: 54qx )把上面下载的json文件放到下面同级文件夹下 参考这句引用let districtData = require('./location');老实说实现方法很简单,antd-mobile提供了组件,只是没提供国家行政区数据,我只是把数据‘交给’这个组件罢了。这里使用的是国家标准(GB/T2260),也就是2016年的标准行政区。如果大佬有最新的数据,希望能分享一下。原创 2019-10-12 13:46:20 · 11491 阅读 · 1 评论 -
rcform
react-component/formhttps://github.com/react-component/form#option-object yiminghe/async-validatorhttps://github.com/yiminghe/async-validator/import { createForm } from 'rc-form';clas...原创 2018-08-30 18:31:35 · 818 阅读 · 0 评论 -
百度地图获取本地搜索(LocalSearch)全部结果并显示标注
业务需求:获取一定范围内百度地图中所有店面(以下代码实现的‘一定范围’指圆,显示某检索值下所有地图返回的店面) var circle = new BMap.Circle(point,1000,{fillColor:"blue", strokeWeight: 1 ,fillOpacity: 0.3, strokeOpacity: 0.3}); map....原创 2018-07-18 11:31:30 · 27469 阅读 · 3 评论 -
js 根据百度地图提供经纬度计算两点距离
正常在使用百度地图时,我们可以通过BMap的实例对象提供的方法计算距离:var map = new BMap.Map('map_canvas');map.getDistance(point1 ,point2);//point1、point2 是Point对象如果在不使用百度地图,但是已知百度地图的经纬度情况下也是可以计算出与上面相同的值的三方库 此库提供计算两点距离的方法 ...原创 2018-05-28 17:58:38 · 5320 阅读 · 3 评论 -
JS中浮点数精度计算
先贴原文地址 http://xieyufei.com/2018/03/07/JS-Decimal-Accuracy.html问题的发现 总结了一下,一共有以下两种问题浮点数运算后的精度问题 在计算商品价格加减乘除时,偶尔会出现精度问题,一些常见的例子如下: 1 2 3 4 5 6 7 8...转载 2018-05-28 17:36:56 · 15199 阅读 · 0 评论