- 博客(27)
- 收藏
- 关注
RSS订阅原创 charles设置本地映射、和取消本地映射
charles如何设置本地映射、和取消本地映射适用情况：遇到接口返回特别快的时候非常郁闷，还得求着接口开发改数据很浪费时间，于是在这种情况下可以使用charles做本地映射。环境：charles版本：3.11.2一：如何设置本地映射1、选中你要进行断点的接口，右键选择Save Respons,把文件保存到本地2，保存格式是bat3、返回到接口处，再点右键，选择Map Local,映射到本地你保存的文件上面4、选择保存成bat格式的文件...
2020-08-13 17:18:09
1848
1
原创 react路由懒加载
react路由懒加载（异步组件）------react-loadablehttps://www.npmjs.com/package/react-loadable安装cnpm install react-loadable基本使用假设现在项目中有个 home页面组件src/pages/home/index.jsimport React, { Component } from 'react'class Home extends Component { render(){
2020-08-12 14:48:43
886
原创 JS宏任务和微任务
js 宏任务和微任务js 宏任务和微任务.宏任务（macrotask）和微任务（microtask）macrotask 和 microtask 表示异步任务的两种分类。在挂起任务时，JS 引擎会将所有任务按照类别分到这两个队列中，首先在 macrotask 的队列（这个队列也被叫做 task queue）中取出第一个任务，执行完毕后取出 microtask 队列中的所有任务顺序执行；之后再取 macrotask 任务，周而复始，直至两个队列的任务都取完。掘金上面盗张图记录一下...
2020-08-07 17:04:51
215
原创 手机访问电脑本地html文件
如果用webstrom打开一个单独的页面，在浏览器中现实的地址是：http://localhost:63342/meipro-work/pages/active/findreset.html?_ijt=jhp5kumvugie2h6r0ublp089kf如果这恰好是你正在开发的用于移动端的页面，想要在手机上访问以便于测试验证效果，怎么访问到呢？在webstorm的setting中是有相关可设置的，只是我试了不好用下面有几种办法：如果你已经安装了全局的node.js，可以使用前两种方法。
2020-08-04 14:08:43
2444
原创 原生JS实现：弹出遮罩层时背景禁止滚动条滚动，隐藏/关闭遮罩层时允许滚动条滚动
//禁止滚动条滚动stopScroll:function(){ document.documentElement.style.overflow=‘hidden’; document.body.style.position=‘fixed’; document.body.style.top=‘0px’; document.body.style.width=“100%”;}//允许滚动条滚动openScroll:function(){ document.docu.
2020-05-19 16:52:21
881
1
原创 利用原生JSJS监听窗口变化及获取窗口大小
js 监听浏览器窗口变化：window.onresize = function() { // 浏览器窗口变化后需要做的事情 // // }窗口大小：var offsetWid = document.documentElement.clientWidth;var offsetHei = document.documentElement.clientHe...
2020-05-08 10:31:37
2552
原创 JS取数字小数点后两位或n位的简单方法
JS取数字小数点后两位或n位的简单方法给大家带来关于JS取数字小数点后两位或n位的简单方法。在js中有时要用到取float数字的小数点后两位的情况。 1 2 3 4 5 var num=10/3; functionrangVal(num,n){ return parseInt(num*Math.p...
2020-04-16 19:53:46
547
原创 前端如何生成条形码---JsBarcode
React 生成条形码代码注：需引入jsbarcode插件import React from 'react';import JsBarcode from 'jsbarcode';class Widget extends React.Component { constructor(props) { super(props); this.state = {...
2020-03-09 17:52:46
2048
原创 封装下拉刷新的功能模块
一、创建简单的html页面：假设代码里的float-box是一个主页面。二、封装下拉刷新的功能模块：（1）首先创建一个Slide构造函数，用来初始化属性与函数。function Slide(dom){ this.start_y=null;//手指滑动屏幕的初始位置 this.end_y=null;//手指滑动屏幕的结束位置 this.render(dom);...
2020-01-14 11:05:39
211
原创 单元测试
1. 测试类型单元测试：指的是以原件的单元为单位，对软件进行测试。单元可以是一个函数，也可以是一个模块或一个组件，基本特征就是只要输入不变，必定返回同样的输出。一个软件越容易些单元测试，就表明它的模块化结构越好，给模块之间的耦合越弱。React的组件化和函数式编程，天生适合进行单元测试 功能测试：相当于是黑盒测试，测试者不了解程序的内部情况，不需要具备编程语言的专门知识，只知道程序的输入、输...
2019-12-27 16:59:18
215
原创 原生 JS 实现最简单的图片懒加载
原生 JS 实现最简单的图片懒加载懒加载什么是懒加载懒加载其实就是延迟加载，是一种对网页性能优化的方式，比如当访问一个页面的时候，优先显示可视区域的图片而不一次性加载所有图片，当需要显示的时候再发送图片请求，避免打开网页时加载过多资源。什么时候用懒加载当页面中需要一次性载入很多图片的时候，往往都是需要用懒加载的。懒加载原理我们都知道HTML中的<img&g...
2019-12-25 14:56:57
151
原创 CSS实现单行、多行文本溢出显示省略号（…）
CSS实现单行、多行文本溢出显示省略号（…）如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来，当然还需要加宽度width属来兼容部分浏览。实现方法：overflow:hidden;text-overflow:ellipsis;white-space:nowrap;效果如图：但是这个属性只支持单行文本的溢出显示省略号，...
2019-12-25 14:56:39
76
原创 VsCode实用快捷键整理
VsCode实用快捷键整理按 Press 功能 Function Ctrl + Shift + P，F1 显示命令面板 Show Command Palette Ctrl + P 快速打开 Quick Open Ctrl + Shift + N 新窗口/实例 New window/instance Ctrl + Shift + W 关闭窗口/...
2019-11-15 11:17:41
178
原创 前端性能优化之--- DNS Prefetch
DNS原理DNS(Domain Name System, 域名系统)，作为域名和IP地址相互映射的一个分布式数据库。当浏览器访问一个域名的时候，需要解析一次DNS，获得对应域名的ip地址。在解析过程中，按照浏览器缓存、系统缓存、路由器缓存、ISP(运营商)DNS缓存、根域名服务器、顶级域名服务器、主域名服务器的顺序，逐步读取缓存，直到拿到IP地址。DNS Prefetch原理DNS P...
2019-07-10 13:04:29
374
原创 使用postMessage来实现父子通信跨域
使用postMessage来实现父子通信跨域1.子向父通信parent.htmlwindow.addEventListener('message',function(e){ console.log(e.data); if(e.data.msg==='xxx'){ //一些自己的业务逻辑 }});...
2019-07-08 18:14:07
2775
原创 js刷新当前页面的5种方式
js刷新当前页面的5种方式1。 reloadreload 方法，该方法强迫浏览器刷新当前页面。语法：location.reload([bForceGet])参数： bForceGet， 可选参数， 默认为 false，从客户端缓存里取当前页。true, 则以 GET 方式，从服务端取最新的页面, 相当于客户端点击 F5("刷新")reload() 方法用于重新加载当前文档。...
2019-06-24 17:04:36
1719
原创 a标签防止页面跳转的实现方式
javascript: 是一个伪协议，其他的伪协议还有 mail: tel: file: 等等。<a id="jsPswEdit" class="set-item" href="javascript:;">修改密码</a>javascript:是表示在触发<a>默认动作时，执行一段JavaScript代码，而javascript:; 表示什么都...
2019-06-21 14:18:34
628
原创 new URLSearchParams( )用法说明
URLSearchParams接口定义了一些实用的方法来处理 URL 的查询字符串。方法：该接口不继承任何属性。URLSearchParams.append()插入一个指定的键/值对作为新的搜索参数。URLSearchParams.delete()从搜索参数列表里删除指定的搜索参数及其对应的值。URLSearchParams.entries()返回一个ite...
2019-06-21 10:49:03
20042
转载 URLSearchParams处理axios发送的数据
除了使用URLSearchParams处理axios发送的数据，但是兼容性不好，其他的兼容方法 在使用axios这个ajax插件的时候，我们有些时候会遇到一些问题，比如：数据格式不正确 以最简单的例子为基础（这里使用post方法）： 在上面的例子中我们直接调用axios的post方法，传给后台的参数为json格式，这和jquery的ajax写法相当类似！ 但是...
2019-06-21 10:30:52
400
转载 git pull遇到错误：error: Your local changes to the following files would be overwritten by merge:
git pull遇到错误：error: Your local changes to the following files would be overwritten by merge:版权声明：本文为博主原创文章，文笔虽然比较差，转载还请注明出处 https://blog.csdn.net/misakaqunianxiatian/article/details/51103734场景：因为...
2019-06-20 22:33:38
1932
转载 mobx用法
observable和autorun1、@observable: 使用此标签监控要检测的数据。（被观察者）2、@observer: 使用此标签监控当数据变化是要更新的Component组件类（观察者）。3、@action:使用此标签监控数据改变的自定义方法(当在需要数据改变的时候执行此自定义方法，那么View层也会跟着自动变化，默认此View层已经使用@observer标签监控)...
2019-06-20 20:15:26
491
转载 React Fetch请求
React Fetch请求最近需要用，所以学习一下1.fetch基于promise的ajax请求https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API2.React使用fetch请求的方法一般放在生命周期的componentDidMount里请求的数据基本格式图片.pngimport Rea...
2019-06-19 23:14:54
494
转载 JavaScript获取操作系统和浏览器名称
JavaScript获取操作系统和浏览器名称检测客户端的操作系统和浏览器名称是比较常见的需求，整理保存一下备用~1、检测浏览器名称 function getBrowser() { var UserAgent = navigator.userAgent.toLowerCase(); var browser = null; var browserArray ...
2019-06-19 17:51:31
727
转载 js-cookie插件的用法
Cookie的使用（js-cookie插件）js-cookie 官方文档里面就详细的介绍了es5怎么引用，以下是ES6以上的用户一、安装npm install js-cookie --save二、引用import Cookies from 'js-cookie'三、一般使用存到Cookie去// 创建一个cookie，在整个站点上都有效:Cooki...
2019-06-18 14:37:10
2627
原创 关于for in的冷门知识点及hasOwnProperty的用法
1.var obj = { name:"AAA", age:18, sex:"male", __proto__:{Lastname:"Pan"} }; for(var key in obj){ if(obj.hasOwnProperty(key)){ console.log(key); } } 通过枚举，打印出对...
2018-09-04 17:49:36
1121
原创 关于ES5新增数组方法（forEach、filter、every、some、map、reduce、reduceRight）原理和运用
ES5数组方法（forEach、filter、every、some、map、reduce、reduceRight）的用法 首先,这里创建先一个数组作为例子为后续使用。 <script> var dataArr = [ {name: "Papa", des: '孙悟空', sex: 'boy', age: 18, gra...
2018-09-04 17:22:20
3027
转载 关于CSDN-markdown编辑器的介绍
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来，用它写博客，将会带来全新的体验哦：Markdown和扩展Markdown简洁的语法代码块高亮图片链接和图片上传LaTex数学公式UML序列图和流程图离线写博客导入导出Markdown文件丰富的快捷键快捷键加粗 Ctrl + B 斜体 Ctrl + I...
2018-09-01 14:55:26
200
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人