web
文章平均质量分 84
wancheng1990
前端开发狗
展开
-
基于vue和jsplumb的工作流编辑器开发(二)
背景本文是对 ‘基于vue和jsplumb的工作流编辑器开发’ 的扩展业务实现撤销初始化数据自动排列清空数据撤销对于撤销的实现,主要是需要一个缓冲内存,存储每次操作之后的数据结构,方便再点击撤销按钮的时候,从缓冲内存中拿出数据结构来渲染页面。利用数组来存储操作之后的数据结构。let MEMORY_LIST = [];这里只缓存10次操作。$_updateMemoryList() { <!--格式化数据结构--> const tempItem = t原创 2021-04-07 15:28:21 · 863 阅读 · 3 评论 -
利用http-proxy实现本地化前端项目dist目录预览
背景前后端分离项目,前端发布基本是在服务器放置一个目录,然后通过 nginx 代理方式,通过监听 / 跳转到前端dist目录存放的路径下的index.html。server{ location / { gzip on; add_header Cache-control no-cache; root 前端dist目录存放的路径; index index.html; try_files $uri $uri/ /inde原创 2020-05-14 11:01:19 · 450 阅读 · 0 评论 -
撸一个jquery的ajax 方法
背景参考jquery 的ajax api 封装了一个ajax 方法技术难点jsonp封装promise支持formData支持便捷方法封装模块化支持jsonp封装jsonp的原理就是基于script 标签,给src 赋值 请求接口,通过传递 回调函数(?callback=jsonp12121)给服务器端,服务器端将响应通过typeof jsonp12121 === 'function' && jsonp12121(respData) 的形式响应给浏览器。完整的json原创 2020-05-10 09:33:54 · 436 阅读 · 0 评论 -
基于vue和jsplumb的工作流编辑器开发
背景需要实现一个工作流,支持拖拽节点生成工作流。业务实现支持页面布局缩放支持节点支持if else支持多分支技术点网格背景工作流缩放工作流技术实现节点拖拽技术选型vuejsplumbsortablejs(vue-draggable)难点攻破网格背景主要是利用css的 linear-gradient 和 background-size 实现的。<...原创 2020-04-29 16:23:29 · 4383 阅读 · 4 评论 -
基于vue的可视化大屏开发
简介业界解决方案百度的 sugar 可视化解决方案https://sugar.baidu.com/home阿里datavhttps://data.aliyun.com/visual/datav腾讯云图https://cloud.tencent.com/product/yuntu尺寸现在一般的大屏设计基本都是16:9 或者是 32:9的尺寸设计稿设计稿给出来的图也基本是16:9...原创 2020-04-27 10:55:32 · 8994 阅读 · 0 评论 -
http 请求头部和相应头部
简介对于请求头部和相应头部的认识请求头部在http请求头部里面 含有的参数有(常用):AcceptAccept-EncodingAccept-LanguageCache-ControlConnectionHostPragmaUpgrade-Insecure-RequestsUser-AgentCookieContent-LengthContent-TypeIf-M...原创 2020-04-26 17:24:53 · 257 阅读 · 0 评论 -
利用axios实现断点续传并支持进度条和取消上传
需求文件上传,如果文件大小小于5M 则直接上传,否则需要切割文件,每个最大5M 大小进行上传。技术选型axios服务器端提供的接口/*** data:传参,是一个formData 对象* processCallback :监听process的函数* cancelFun :取消函数*/function uploadFile(data, processCallback, can...原创 2020-04-25 10:27:50 · 1511 阅读 · 0 评论 -
react hook 小结
文章目录redux 的坑函数组件Hook 的含义注意项useState() 状态钩子demo更新state的函数 setXXXuseContext() 共享状态钩子useReducer() action 钩子useEffect() 副作用钩子业务上面的帮忙useCallback为什么 useCallback 比 componentDidUpdate 更好用useMemo 做 PureRenderu...原创 2020-04-24 10:01:36 · 505 阅读 · 1 评论 -
头像图片上传可能会用到的图片压缩和图片旋转技术
业务背景突然有一次搞活动,需要用户上传自己的自拍照,然后服务器端把头像做些特殊处理,这个时候可能会遇到的坑。坑点二:人像是倒着的如果用户直接采用摄像头拍照,这样的话获取到的照片可能会是倒着的,这样是影响业务的。坑点一:图片过大现在手机拍出来的照片,基本都是5M 以上的图片,对于上传压力太大了。解决方案人像是倒着的: exif.js 来解决可以通过 exif.js 来获取图片的各种信...原创 2020-04-18 17:16:20 · 182 阅读 · 0 评论 -
从头编写一个 HTTP 静态资源服务器
首先需要的Node 模块有 http,url,path,fs 模块。// 提供一个http 服务var http = require('http');// 用于处理 url 字符串和 url对象var url = require('url');// 用于处理文件路径var path = require('path');// fs 模块 用于读取文件的var fs = requir...原创 2020-04-18 12:23:34 · 177 阅读 · 0 评论 -
理解浏览器宿主环境下,javascript引擎对于脚本的处理
# 脚本处理模型## JavaScript的基本特点1. js是一门相当简单的运行时解释语言。2. 对象模型很直接也没有类的概念(ES5)。3. 有自动垃圾回收。4. 弱数据类型。5. 动态类型(dynamic typing):运行的时候才确定对象的类型。6. javascript没有内置的I/O机制。扩展:javascript程序与宿主环境进行交互,是通过一系列预定义的方...原创 2018-10-23 20:03:15 · 247 阅读 · 0 评论