自定义博客皮肤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)
  • 收藏
  • 关注

原创 前端自动化部署,基于scp2,ssh2

前端自动化部署,基于scp2,ssh2配置文件deploy/products.js/* * @author: linzl * @method: * @param: * @Date: 2021-05-11 14:32:22 * @return: *//* *读取env环境变量 */ const SERVER_ID = process.env.NODE_ENV === "prod" ? 0 : 1; /* *定义多个服务器账号 及 根据 SERVER_ID 导出当前环境服

2021-05-11 15:47:48 503 2

原创 js原地快排

原地快拍/* * @author: linzl * @method: * @param: * @Date: 2021-04-25 21:40:46 * @return: */function qsort(arr, start, end){ if(start >= end) return let i = start, j = end let mid = arr[start] while(i<j){ while(i<j

2021-04-25 22:00:29 335

原创 Vue3 简版reactive实现

reactive依赖收集#mermaid-svg-HmD6MThEfPnNFc7v .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-HmD6MThEfPnNFc7v .label text{fill:#333}#mermaid-svg-HmD6MThEfPnNFc7v .node rect,#mermaid-

2021-04-13 11:27:47 279

原创 算法-堆实现js

堆利用数组模拟堆结构堆的节点关系 i 的左节点 为 2i +1, 右节点 2i +2#mermaid-svg-Qp2Cbwjhzld49dBp .label{font-family:'trebuchet ms', verdana, arial;font-family:var(--mermaid-font-family);fill:#333;color:#333}#mermaid-svg-Qp2Cbwjhzld49dBp .label text{fill:#333}#mermaid-svg-Qp2

2021-04-10 14:12:08 113

原创 LRU算法 JS实现,双向链表+哈希表

定义节点class Node { constructor(prev, next, key, value){ this.prev = prev this.next = next this.value = value this.key = key }}LRU算法class LRU { constructor(limit){ this.map = new Map() this.hea

2021-02-01 16:53:06 282

原创 element-ui笔记

Element安装npm i element-ui -S项目导入import Vue from 'vue'import ElementUI from 'element-ui'import 'element-ui/lib/theme-default/index.css'import App from './App.vue'Vue.use(ElementUI)new Vue({ el: '#a

2020-12-18 10:15:34 1233

原创 Three笔记

1. 场景内容程序结构层级关系OrbitControls.js控件支持鼠标左中右键操作和键盘方向键操作材质类型 功能材质类型功能MeshBasicMaterial基础网格材质,不受光照影响的材质MeshLambertMaterialLambert网格材质,与光照有反应,漫反射MeshPhongMaterial高光Phong材质,与光照有反应MeshStandardMaterialPBR物理材质,相比较高光Phong材质可以更好的模拟金属、玻璃等效

2020-12-18 10:15:01 125

原创 迭代器

迭代器结构数字序列生成器实现标准的迭代器接口var something = (function(){ var nextVal; return { // for..of循环需要 [Symbol.iterator]: function(){ return this; }, // 标准迭代器接口方法 next: function(){ if (nextVal === undefined) { nextVal = 1; } else {

2020-12-18 10:14:20 112 1

原创 Vue2 路由重构

问题使用element-ui 的menu组件,在非菜单的页面,左侧会高亮不了由于路由没做权限拦截,用户知道路径可以随意跳转解决思路将路由分为无权限路由和需要验证权限路由利用路由守卫,处理权限接口和权限路由对每个路由进行配置/** * { * path:'/', * redirect:'', * component: ()=>import(), * meta?: { * activeIndex:'', //激活菜单栏的参照

2020-12-18 10:09:18 432

原创 处理多个echarts图表在窗体变化重绘

思路利用window.onsize = ()=>{} 监听窗体变化利用防抖降低触发的频率修改store里面参数,利用store里面的值变化通知所有混入mixin的组件echarts实例将自己的id 和 resize函数,存入到mixin的cbList里面代码:mixin 代码:export default { data() { return { cbList: new Map() // 存放需要重绘的图例, key 和 函数

2020-12-14 17:58:05 601

原创 webpack 优化插件

1 hard-source-webpack-plugin功能:HardSourceWebpackPlugin是webpack的插件,为模块提供中间缓存步骤。为了查看结果,您需要使用此插件运行webpack两次:第一次构建将花费正常的时间。第二次构建将显着加快 。使用:npm install hard-source-webpack-plugin地址:https://developer.aliyun.com/mirror/npm/package/hard-source-webpack-plugi

2020-11-28 10:34:29 342 1

原创 修改谷歌输入框自动填充的背景

背景项目要求一个偏蓝的输入框。修改下样式.ant-input { color: #fff; background-color: transparent; &::placeholder{ color: #788BAC; } &:hover { background-color: transparent; }}解决了在没有自动填充时的样式,看上去是可以了。但是在有自动填充的时候解决方法1 直接去

2020-11-25 18:33:08 178

原创 手机端canvas文字出现模糊

手机端canvas文字出现模糊使用window.devicePixelRatio设备上物理像素和设备独立像素(device-independent pixels (dips))的比例来设置canvas实际需要放大的倍数获取像素之间的放大比例export function getRatio () { const canvas: any = document.createElement('canvas') const devicePixelRatio = window.devicePixelRat

2020-09-27 15:01:05 841

原创 js的节流实现

throttlefunction getUserAction(e) { ...};container.onmousemove = debounce(getUserAction, 1000);第一版本,使用时间戳, 利用闭包保存previous的值,记录上一次运行的时间戳,与当前时间相差超过 wait 毫秒则运行 // 第一版function throttle(func, wait) { var context, args; var previous = 0;

2020-09-18 14:53:11 1979

原创 js的防抖实现

debounce防抖function getUserAction(e) { ...};container.onmousemove = debounce(getUserAction, 1000);最简单版本,利用setTimeout 和 clearTimeoutfunction debounce(func, wait) { var timeout; return function () { clearTimeout(timeout) timeo

2020-09-18 10:59:05 1471

原创 前端腾讯地图marker优化

思路1 监听地图的拖拽 和 缩放事件2 根据地图的可视区域,显示在范围里面的锚点,3 筛选出地图范围里面的点,将点更新到地图,4 删除地图上存在范围外的点监听地图事件防止事件触发太多频繁,增加防抖map.on("dragend", function (e:any) { debounce(()=>{ renderPoint(list) })()})map.on("zoom", function (e:any) { debounce(()=>

2020-07-03 15:04:10 3774

原创 简单串口调试工具 Electron 版本

界面功能都比较简单,串口和波特率写死在代码了。构建项目可能会有node版本的问题,需要重构node依赖npm installnpm install serialport npm install electron-rebuild --save-dev.\node_modules\.bin\electron-rebuild.cmdnpm install electron-builder --dev执行代码是在index.js ,所以 main.js 要开启Node Api的权限 nodeIn

2020-06-18 11:14:46 886 2

原创 React Web项目本地调试随时切换服务器环境

使用方法和后台联调,每次切换服务器都得重启,所以将接口做成可以变化的。根据mode的值选择不同的环境:一般:prod | test | proxy | dev, 可以自己根据代码里面修改例如: http://localhost:8082/?mode=dev#/不过建议此操作只在本地运行的时候生效,在package.json 里面还是写固定的,不然部署出事就GG了。package.json 部分代码"scripts": { "start": "set PORT=8082 &&a

2020-06-18 10:49:49 1383

原创 Node代理,http-proxy-middleware,POST请求失败

Node代理,http-proxy-middleware,POST请求失败http-proxy-middleware,POST请求失败解决方案1:解决方案2http-proxy-middleware,POST请求失败因为 bodyParser 导致的代理转发带有 body 数据的 post 请求会失败var express = require('express');var cookiePa...

2019-07-16 10:12:52 4980

原创 VueX笔记

VuexState用一个对象就包含了全部的应用层级状态。 computed:{…};//内存常驻,频繁的改变 Vuex 通过 store 选项,提供了一种机制将状态从根组件『注入』到每一个子组件中(需调用 Vue.use(Vuex)):const app = new Vue({ el: '#app', // 把 store 对象提供给 “store” 选项,这可以把 store 的实例注

2017-09-14 17:23:43 554

原创 Angular1 笔记

Angular语法/*循环用法,变量引用*/<li ng-repeat="phone in phones"> <span>{{phone.name}}</span> <p>{{phone.snippet}}</p> </li>控制器//控制器绑定<body ng-controller="PhoneListController">...</body>//控制器

2017-08-02 09:27:29 204

原创 正则表达式笔记

正则表达式

2017-02-03 13:15:39 255

空空如也

空空如也

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

TA关注的人

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