- 博客(21)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 基于 react、react-hooks、redux、ts手写ant-design-pro，搭配 node、eggjs、ts、mysql、redis配套api
介绍最开始的时候，我需要一个 react 开发的 amdin 模版，在开源社区寻找了一边之后，比较中意 ant design pro 的 UI，当我一堆操作把 ant desgin pro 的代码拉下来研究之后，发现内容是在太多了，除了 react、redux 之外，还包含了 umi、dva、ant-design/pro-layout 等其它东西，当这些概念和 ts 结合起来使用的时候，作为一个...
2020-01-29 17:41:31
1371
原创 呕心沥血，一文看懂 react hooks 中 useState、useEffect、useContext、useRef、自定义hook
一遍就能学会的 react hooks介绍react hooks 是 React 16.8 的新增特性。 它可以让我们在函数组件中使用 state 、生命周期以及其他 react 特性，而不仅限于 class 组件react hooks 的出现，标示着 react 中不会在存在无状态组件了，只有类组件和函数组件对比存在即合理，hooks 也不例外，它的出现，就代表了它要解决一些 clas...
2019-10-05 17:22:11
36512
9
原创 axios 重构系列之一张图看懂axios源码系列（一）
背景介绍axios 作为一个在前端领域非常重要的 HTTP 请求库，不管是 Vue、React 还是 Node，甚至任何 JS 可以运行的地方，都有可能出现，可以说，axios 是前端绕不过去的一个槛，掌握 axios 的原理、对我们日常开发和技术学习有着非常重要的意义。同时，axios 源码中，有着非常优秀的设计思想，是每一个 前端开发 都应该去学习和借鉴的，了解其中的原理并将其运用到我们代...
2019-08-08 00:06:08
1003
原创 小程序页面通信、数据刷新、事件总线 、event bus 终极解决方案之 iny-bus
背景介绍在各种小程序中，我们经常会遇到 这种情况 有一个 列表，点击列表中的一项进入详情，详情有个按钮，删除了这一项，这个时候当用户返回到列表页时，发现列表中的这一项依然存在， 这种情况，就是一个 `bug`，也就是数据不同步问题，这个时候测试小姐姐肯定会找你，让你解决，这个时候，你也许会很快速的解决，但过一会儿，测试小姐姐又来找你说，我打开了四五个页面更改了用户状态，但我一层...
2019-08-04 21:32:31
3112
1
原创 React 中性能优化、 memo、 PureComponent、shouldComponentUpdate 的使用
React 中性能优化、 memo、 PureComponent、shouldComponentUpdate 的使用场景React 是一个用于构建用户界面的 JavaScript 库，主要负责将数据转换为视图，要保证数据和视图的统一，react 通过 重新 render 来保证数据和视图的统一，但当数据没有变化时，视图重新渲染，就会造成不必要的性能浪费看下面这个例子， import ...
2019-07-12 11:36:51
1681
原创 React 中 lazy, Suspense 以及错误边界(Error Boundaries)的使用
React 中 lazy, Suspense 以及错误边界(Error Boundaries)的使用lazylazy 是 react 提供的组件懒加载的能力，在官方没有支持 lazy之前，在 react 中我们一般使用 react-loadable 来实现组件懒加载的能力，但是，lazy 并不支持 服务端渲染（SSR），所以在使用ssr的情况下，lazy 暂时不能使用React.lazy...
2019-07-09 21:05:40
6459
原创 React 中 Context 和 contextType的使用
React 中 Context 的使用contextContext 提供了一种方式，能够让数据在组件树中传递时不必一级一级的手动传递一般情况下，数据在组件中，要一级一级的传递，单向数据流，比如Parent组件中的theme值，需要在Item组件中使用，就需要我们从Parent中向下传递，但当我们有了Context后，我们就不需要一级一级传递了 Parent(theme=red)...
2019-06-24 19:31:38
10436
1
原创 总结 ： js `防抖` 和 `节流`
防抖什么是防抖，一般我们在 input 输入框中输出值，并且向服务端查询数据的时候，如果每次 input 值发生改变，都向服务器发请求的话，难免会资源浪费，并且用户体验并不好，那么我们可以在 input 输入值后延迟一段时间，再发请求。就是 防抖 <body> <input type="text" id="text"> <script&g...
2018-06-08 14:21:45
2304
原创 理解javascript中event loop, 了解其背后的原理
问题今天看到一个问题，什么是 event loop , setTimeout 和 Promise.resolve().then() 的表现为何又不一样，想了想，决定梳理一下相关知识，这里只说浏览器环境，先不考虑 Node 环境中的 process.nextTick()之类的先做个简单测试 console.log(1) setTimeout(() =&gt; c...
2018-06-04 23:49:22
2674
1
原创 css 双飞翼布局（flex 、float）和 圣杯布局
双飞翼布局双飞翼布局，是一种页面布局的形象的表达。具体表现形式为 两边顶宽，中间自适应宽度的三栏布局，中间栏要放在HTML文档流的最前，优先渲染实现方式float 浮动流页面基本布局很简单，总共有三栏，中间栏位于文档流的最前面，优先渲染“` // 中间栏，位于文档流的最前面 // 中间栏内容 ...
2018-05-30 10:07:54
2360
原创 ajax 跨域根源分析 （一）
ajax 跨域原因浏览器限制很多人认为，跨域问题时后台造成的，其实不然，真正造成跨域问题的原因是浏览器，浏览器出于安全的考虑，当发现你的请求是跨域的，浏览器会做一些安全校验，当校验不成功时，就会报跨域错误，说白了就是浏览器多管闲事。这个问题具体可以通过浏览器控制台中的network中查看，当发出一个ajax请求时，可以看到后台的响应是 200，说明后台是成功处理这...
2018-03-14 00:43:06
285
原创 js上传图片之前利用canvas压缩和转base64
js上传图片之前利用canvas压缩和转base64简介img-compress-tool 是一个通过js和canvas api 对图片文件进行压缩，实现基于es6的语法，适用于pc端和移动端
2018-02-26 16:36:57
511
原创 node js 之 mongodb dao 封装
github点这里'use strict'//引入mongodbconst MongoClient = require('mongodb').MongoClient;//加载开发配置const config = require('../config/index.js');//创建公用数据库连接const _connectDB = (callback) => { MongoClient
2018-02-08 13:43:18
267
原创 解决vue在ie9中的兼容问题
vue 解决ie9的兼容问题当vue遇见ie9的时候，部署到服务器之后，打开居然是一片空白，vue是支持ie9的，这个时候就需要来一波兼容了参考尤大的解答 https://github.com/vuejs-templates/webpack/issues/260首先npm install –save babel-polyfill然后在main.js中的最前面引入babel-po
2018-01-24 12:46:26
42838
1
原创 vue js 幸运大转盘
vue js 幸运大转盘在写一个 vue 项目时，用到了转盘抽奖，发现网上没有现成的 vue 案例，于是将自己写的分享出来，用作交流使用效果 流程页面created时，加载奖品列表，根据和后台预先定义好的字段格式化奖品列表检查是否有抽奖资格 点击抽奖，抽奖次数减一发送http请求，获取后台反馈的奖品在奖品列表中的下标跟据奖品，转盘开始转动，转到相应奖品区域弹出奖品通知modal关闭m
2017-11-07 14:54:21
18881
27
原创 总结：闭包
1. 什么是闭包 即重用一个变量，又保护变量不被污染的一种机制2. 为什么要用闭包 全局变量: 优点: 可重用！ 缺点: 易被污染！ 局部变量: 优点: 不会被污染 缺点: 不可重用
2017-08-19 00:02:39
415
原创 JS 之排序算法和去重复算法
排序算法1. 冒泡排序数组API : arr.sort()原理：将每个数组元素转为字符串，然后按字符串比较大小。 问题：只能按字符串排序，无法按照数字排序。 解决：自定义比较器函数//升序排列function cmp(a,b) {return a-b};var arr=[4,3,5,6,1];arr.sort(cmp);console.log(arr.sort(cmp));//[1,3,
2017-08-14 21:39:09
762
原创 Javascript+Ajax+Node JS +socket .io +mysql 实现在线私人聊天
说明学完Node JS 之后，一直想写一个关于Node的项目，正好了解到html5中的websocket，所以花了一周时间写了这个在线聊天项目，程序还存在一些功能没有实现，后期会继续开发，实现离线消息推送和群聊功能，还想做一些小游戏放到里面，边聊天边玩游戏。实现功能支持注册、登录、在线单人聊天、表情发送、各种文件上传下载、增删好友、聊天记录保存、通知声开关、背景图片切换、更换签名
2017-08-06 20:51:20
1130
3
原创 Ajax 配合node js multer 实现文件上传
说明 最近在做一个聊天软件，支持注册、登录、在线单人、多人聊天、表情发送、各种文件上传下载、增删好友、聊天记录保存、通知声开关、背景图片切换、游戏等功能，因为是学前端的，所以使用ajax和multer来实现，经过各种查文档，做demo例子，终于成功实现单个文件上传功能，支持大部分文件格式上传，
2017-08-06 13:21:02
2552
4
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人