自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(22)
  • 资源 (1)
  • 收藏
  • 关注

原创 如何发布一个npm包

b)右上角选择生成新的token,根据需要选择 token 类型(以 Classic Token 为例)a)npm官网登录后,头像下拉选择 Access Tokens。a. 邮箱会在本地登录时发送验证码使用。d)复制生成的 token 设置到本地。b. 发布包后邮箱会收到通知。c)选择 publish。

2023-06-02 16:50:06 964

原创 浅析React Hook之useReducer

Fiber树循环链表useReducer

2022-06-30 17:16:55 378

原创 三步学会canvas

canvas作为HTML5新增的组件,给前端开发提供了绘制图形与简单动画的能力。作为一个前端开发工程师,canvas是一个必须要了解学习的组件,用canvas画出一个好看的图形,还是很有成就感的。

2021-03-29 11:13:11 593

原创 JavaScript深度剖析之手写Promise源码

友情提示:本文内容过长,建议先收藏目录核心逻辑实现一、Promise核心逻辑实现二、在 Promise 类中加入异步逻辑三、实现 then 方法多次调用添加多个处理函数四、实现then方法的链式调用五、then方法链式调用识别 Promise 对象自返回六、捕获错误及 then 链式调用其他状态代码补充1. 捕获执行器的错误2. then执行的时候报错捕获3. 错误之后的链式调用4. 异步状态下链式调用七、将then方法的参数变成可选参数八、promise.all方法的实现九、Promise.resolv

2021-01-18 10:12:09 198

原创 JavaScript深度剖析之异步编程

(友情提示:本文内容过长,建议先收藏。)目录采用单线程模式工作的原因单线程的优势和弊端异步编程的内容概要同步模式与异步模式同步模式异步模式同步模式API和异步模式API的特点回调函数 —— 所有异步编程方案的根基Promise —— 一种更优的异步编程统一方案Promise概述Promise基本用法Promise案例Promise的本质Promise链式调用常见误区链式调用的理解Promise异常处理then中回调的onRejected方法.catch()(推荐)全局对象上的unhandledreject

2021-01-10 17:08:09 307

原创 JavaScript深度剖析之函数式编程

JavaScript函数式编程目录内容介绍为什么要学函数式编程?什么是函数式编程?函数式编程和面向对象编程的不同对于函数式编程思维方式的理解:函数式编程的前置知识函数是一等公民高阶函数什么是高阶函数?使用高阶函数的意义常用的高阶函数闭包闭包的概念闭包的核心作用闭包的本质闭包的案例案例一案例二纯函数纯函数的概念Lodash——纯函数的代表体验Lodash纯函数的好处可缓存可测试并行处理副作用柯里化Lodash中的柯里化 —— curry()案例柯里化原理模拟柯里化总结函数组合背景知识管道Lodash中的组合函

2021-01-09 23:56:37 617

原创 React数据流管理架构之Mobx

Mobx状态管理1.原理2.MobX核心API(适用mobx 4.X/ mobx 5.X)3.使用步骤1. 安装2. 新建Store文件3. 定义observable并使其可观察4. 创建视图以响应状态的变化5. action更改状态4.MobX6.0版本更新5.参考文档1.原理React和MobX是一对强力组合。React的render机制,是通过管理state的状态变化来渲染组件,而Mobx则提供了一种响应式的存储、更新状态的方法。使用MobX将应用变成响应式可归纳为三部曲:定义状态并使其可观

2020-12-21 17:15:34 652 2

原创 Fetch封装的HTTP请求

类似axios请求的二次封装,使用更简单前言封装源码使用结语前言Web项目开发过程中,发送http请求数据是必不可少的的一步,我们姑且不讨论哪种方式更好,在这里我将项目中使用的fHTTP请求的方法进行了一个简单的二次封装,希望能让今后的编码更高效。封装源码/** * @author kqzhu * @version 1.0.0 * @date 2020/10/30 * @description 系统通用fetch数据请求 */import fetch from 'dva/fetch

2020-10-31 13:31:15 1241

原创 chrome浏览器跨域Cookie的SameSite问题导致访问iframe内嵌页面异常

Indicate whether to send a cookie in a cross-site request by specifying its SameSite attribute问题还原原因分析可能在 Chrome 80 中受到影响的场景如下解决方案问题还原原先一直访问正常的系统,最近打开页面一直加载不出来。初步分析,该系统为iframe内嵌第三方系统页面,将iframe中的链接复制出来可以单独访问,排除第三方系统的问题。进一步尝试,将这个带有链接的iframe放在一个全新的html文件

2020-09-16 18:25:51 60065 16

原创 JSP中使用ES6模板字符串的$符号冲突问题

jsp中使用反撇号书写html代码取不到变量值问题截图:问题描述:jsp中遍历数据动态绘制表格,在反撇号中使用${}无法识别变量和表达式。问题原因:在jsp页面中,EL表达式也是使用 $ 符号来插入变量的,所以在模板字符串中使用 $ 符号会造成冲突从而不会被识别。例如:<img src="${pageContext.request.contextPath }/${data[i].image}">$ {pageContext.request.contextPath }在jsp中

2020-08-20 19:14:45 2801 5

原创 基于React封装的排序按钮通用组件

效果图逻辑简述此组件需传入一个默认排序状态(无序、正序、倒序)和一个点击事件函数(根据点击次数在无序、正序、倒序之间切换并查询数据)核心源代码在你的components文件夹下新建SortButton文件夹,在SortButton文件夹下新建index.jsx文件,复制粘贴以下代码:/** * @author kqzhu * @date 2020/04/26 * @description 排序按钮组件 * @params children(String):需要显示的DOM子元素, cl

2020-07-24 15:53:59 1108

原创 基于React封装的占比进度条组件

电池型百分比数据显示React组件效果图源代码参数说明效果图(注:可以搭配antd的table,嵌入在表格中使用效果最佳)源代码import React, { Component } from 'react';import PropTypes from 'prop-types';export default class ProgressBar extends Component { constructor(props) { super(props); this.sta

2020-06-30 14:55:43 2076

原创 ES6语法及知识点梳理

变量声明ES6引入了let关键字,该关键字允许无法提升或重新声明的块范围变量。let x = 0常量声明ES6引入了const关键字,该关键字不能重新声明或重新分配,但不是不变的。const CONST_IDENTIFIER = 0箭头功能箭头函数表达式语法是创建函数表达式的一种较短方法。Arrow函数没有自己的函数this,没有原型,不能用于构造函数,也不应用作对象方法。le...

2020-04-18 12:30:52 1740

原创 可视化数据分析图表设计必学技巧

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...

2019-12-10 20:07:27 5828

原创 JavaScript接收URL中英文混合参数解码出现乱码

同时使用unescape和decodeURL就可以解决了

2019-11-27 11:58:40 357

原创 XMLHttpRequest cannot load http://xxx.xxx. No Access-Control-Allow-Origin header is present 报错的解决方法

JSONP利用了js脚本不受同源限制。前后端规范统一的脚本方法名,来传递数据执行特定的方法。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>JSONP-demo</title></head>&l...

2019-10-16 11:17:16 1816

原创 Web页响应式设计的一些解决方案

Web页响应式设计的一些解决方案前言背景介绍响应式与自适应的区别合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入前言随着移动互...

2019-09-05 17:50:48 2344

原创 数据可视化有哪些展现形式

数据展示应该是PPT的最常见的一个需求,用数据做总结、用数据做分享,版面漂亮不如数据漂亮。但是有了数据,如何更好地呈现给我们的受众、让我们的表达更加动人?这是个值得让人思考的问题。说到数据表达呢,依托于PPT本身的文档内容呈现方式,常用的数据展示方式主要就是纯数据数字、表格、图表三类,那么今天就以此为大家展开描述。Part 1 表格数字表格,号称办公文档“大表哥”。因为一提起数据,可...

2019-08-21 10:20:17 22453

原创 CSS实现HTML元素垂直居中的12种方法

本篇文章主要给大家介绍一下如何使用html+css实现元素的垂直居中效果,这也是我们网页在编码制作中会经常用到的问题,很多同学可能会说我知道怎么做,但是这里我收集总结了最全面的实现方式,看看哪一种办法更好呢。

2019-08-01 19:47:53 2672

原创 JS中字符串拼接+=与push的性能比较

+=与push性能比较for循环遍历拼接字符串for循环遍历拼接字符串代码片.// An highlighted blocklet arr = new Array();for(let i = 0, len = 1000000;i &lt; len; i++){ arr.push(i+"测试字符串---");} function foradd(my_arr){ let...

2019-07-30 10:14:23 298

原创 文本域获得焦点时多出一个小点

安卓手机上点击文本域左上角会产生一个小点笔者最近在做一个H5页面的时候遇到这样一个问题(如下图所示),iPhone上没有这个情况。最后通过检查CSS找到解决办法:由于我设置了文本域的字数限制,然后又给了一个overflow-y的溢出,导致滚动条的出现,将overflow-y的样式去掉就OK了,如果你也遇到同样的问题,不妨试试。...

2019-07-30 09:44:56 354 1

原创 EchartsUtil

EchartsUtil由于最近在项目开发中经常会用于echarts进行数据可视化的图表设计制作,许多图表都需要重复书写大量的option代码,现将这些公共配置项和重复代码二次封装集成到这个辅助工具里面,只需要根据后台返回的数据形式调用相应的方法,传入一个data和DOM容器ID就能呈现图形,省去了诸多前后端数据处理的工作。源码下载:echarts-util.js使用步骤:1、引入echar...

2018-11-01 11:43:17 3159

echarts复用

当你在一个页面上做多个和echarts图形,并且这些图形都是同一个类型,只是数据不一样或者简单的样式不同,可以用这个echarts对象复用来解决更简单。

2018-09-05

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除