JavaScript武器库
给大家提供更简约,更实用,更风骚的代码。武装自己。
攻城狮Lee丶
一个奇葩的程序员,外冷内热,有点闷骚 ,生活状态下是个逗比,工作时是个完美主义者。....................
展开
-
高德地图基于Three开发三维流动管线。
废话少说直接上干货,整体思路通过高德地图的GLCustomLayer图层加载Three三维管线。initThree 初始化三维场景 设置镜头 灯光 场景等。TubePath 为第三方工具 引用方法如下。buildWater 根据三维坐标加载管道水流。buildPipe 根据三维坐标加载管道璧。第一步将管线经纬度转成三维空间经纬度。原创 2024-06-28 15:18:14 · 460 阅读 · 0 评论 -
微前端子应用nginx跨域配置
当出现403跨域错误的时候。原创 2023-04-19 15:57:38 · 493 阅读 · 1 评论 -
fabric 图形放大后边框保持不变
fabric 图形放大后边框保持不变原创 2022-11-08 08:43:16 · 547 阅读 · 0 评论 -
fabric加载gif图片
fabric加载gif图片原创 2022-11-05 13:44:58 · 766 阅读 · 0 评论 -
IntersectionObserver
IntersectionObserver解决元素在可视区判断问题。原创 2022-07-12 16:17:56 · 342 阅读 · 0 评论 -
代替if的6种方法
1. 三元运算符。事例1带有IF的代码:function test(state) { if (state) { database.save(state) } else { alert('state is invalid') }}重构后代码:function saveCustomer(state) { return state ? database.save(state) : alert('stateis invalid')} .原创 2022-02-18 08:36:04 · 6776 阅读 · 0 评论 -
代替if的6中方法
最近在重构代码时,我发现早期的代码使用太多的if语句,其程度是我从未见过的。这就是为什么我认为分享这些简单的技巧是非常重要的,这些技巧可以帮助我们避免过多的使用if语句。接下来会介绍6种方式来代替if的使用,这样做不是坚决不使用if偏执狂,而是换个方式思考我们的编码思路。1. 三元运算符事例1带有IF的代码:function saveCustomer(cust...原创 2020-04-15 16:24:07 · 179 阅读 · 0 评论 -
mapbox实现鼠标框选选中图层功能
mapbox实现鼠标框选选中图层功能原创 2022-02-17 16:19:51 · 2529 阅读 · 0 评论 -
Antd InputNnmber小数点保留两位
const limitDecimals = (value) => { const reg = /^(\-)*(\d+)\.(\d\d).*$/; if(typeof value === 'string') { return !isNaN(Number(value)) ? value.replace(reg, '$1$2.$3') : '' } else if (typeof value === 'number') { return !isNaN(valu.原创 2021-05-27 16:03:35 · 2343 阅读 · 0 评论 -
react 下载文件
/** * @desc 下载文件 * */ exportFile = url => { const linkElement = document.createElement('a'); linkElement .style.display = 'none'; linkElement .href = url; document.body.appendChild(linkElement ); li.原创 2021-04-06 19:47:22 · 583 阅读 · 0 评论 -
解决移动端removeEventListener无效问题
preventDefault = (e)=>{ e.preventDefault();}//添加监听事件document.addEventListener("touchmove", this.preventDefault , { passive: false });//移除监听事件document.removeEventListener("touchmove", this.preventDefault ,{ passive: false });document.addEve.原创 2021-02-09 11:07:52 · 1286 阅读 · 0 评论 -
antd-mobile+rc-form处理移动端表单验证
import React, {Component} from 'react'import { createForm, formShape } from 'rc-form';import { InputItem } from 'antd-mobile';class Form extends Component { static propTypes = { form: formShape, }; state = { nameErr: true }; submit =.原创 2021-01-02 11:32:25 · 3014 阅读 · 0 评论 -
记录一个React路由嵌套问题---引以为戒
1.React嵌套路由的父级不能添加exact属性,否则二级路由不显示。2.第一条带来的后遗症,如果不添加exact就会出现一级路由同时显示的问题,所以一级路由要用Switch包裹。一级路由<Router basename={'/basic'}> <Suspense fallback={<div/>}> <Switch> <Route path={'/login'} component={lazy(() =>原创 2020-11-06 10:37:02 · 706 阅读 · 0 评论 -
Antd 4 获取Form字段值
类组件获取表单字段值由于Antd 4中去除了Form.create方法创建Form实例得到getFieldDecorator、validateFields等方法,我们使用类组件想要Form上的方法就需要用到Ref来获得实例。import React, { Component } from 'react'import { Form, Input, Button } from 'antd'class Example extends Component { // 通过...转载 2020-10-20 11:55:37 · 6551 阅读 · 0 评论 -
Vue源码分析——第三章
Vue源码分析——第一章Vue源码分析——第二章 // only used in dev mode //检测 val必需是数字 function checkDuration(val, name, vnode) { if (typeof val !== 'number') { warn( "<transition> explicit " + name + " duration is not a valid number - " + "got " + ...原创 2020-09-10 16:28:10 · 591 阅读 · 0 评论 -
Vue源码分析——第二章
/* * Object.defineProperty(person,'name',{ configurable:false,//能否使用delete、能否需改属性特性、或能否修改访问器属性、,false为不可重新定义,默认值为true 是否可以编辑 enumerable:false,//对象属性是否可通过for-in循环,flase为不可循环,默认值为true 是否可以枚举遍历 writable:false,//对象属性是否可修改,flase为不可修改,默认值为true value.原创 2020-09-10 15:05:35 · 515 阅读 · 0 评论 -
Vue源码分析——第一章
Vue最新版本源码分析,每个函数功能注释的很清楚,重点模块逐行注释!/*! * Vue.js v2.6.9 * (c) 2014-2019 Evan You * Released under the MIT License. */(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() : .原创 2020-09-09 14:26:07 · 2008 阅读 · 0 评论 -
uni-app 页面跳转
今天看Dcloud官网更新了个uni-app,据说一套代码三端发布(Android,iOS,微信小程序),果断一试。uni.navigateTo(OBJECT)保留当前页面,跳转到应用内的某个页面,使用uni.navigateBack可以返回到原页面。OBJECT参数说明参数 类型 必填 说明 url String 是 需要跳转的应用内非...原创 2020-06-15 09:02:29 · 195462 阅读 · 23 评论 -
vue\cli3.0 配置静态资源问题
重要事情说三遍vue\cli3.0的静态资源要(放在public目录下!放在public目录下!放在public目录下!)这样在打包时不会被解析,而直接引用他。图片资源引入data () { return { imgUrl: require('1.jpg') }}<img :src="imgUrl" alt="" />本地资源下载data () { return { resourcePath: process.env.BA.原创 2020-05-26 09:42:58 · 10520 阅读 · 0 评论 -
JavaScript事件循环机制(event loop)
首先我们要知道两点:JavaScript是单线程的语言 Event Loop是javascript的执行机制javascript事件循环js是单线程,就像学生排队上厕所,学生需要排队一个一个上厕所,同理js任务也要一个一个顺序执行。如果一个任务耗时过长,那么后一个任务也必须等着。那么问题来了,假如我们想浏览新闻,但是新闻包含的超清图片加载很慢,难道我们的网页要一直卡着直到图片完全显示出来?因此聪明的程序员将任务分为两类:同步任务 异步任务从图片可知,一个方法执行会向...转载 2020-05-09 16:23:12 · 2019 阅读 · 0 评论 -
JavaScript代码规范(一)
简介将源自 Robert C. Martin 的Clean Code的软件工程原则适配到 JavaScript 。 这不是一个代码风格指南, 它是一个使用 JavaScript 来生产 可读的, 可重用的, 以及可重构的软件的指南。这里的每一项原则都不是必须遵守的, 甚至只有更少的能够被广泛认可。 这些仅仅是指南而已, 但是却是Clean Code作者多年经验的结晶。我们的...转载 2020-05-07 11:48:04 · 2470 阅读 · 0 评论 -
TypeScript报错信息表(备注)
code 类型 英文描述 中文描述1002 错误 Unterminated string literal. 未终止的字符串文本。1003 错误 Identifier expected. 应为标识符。1005 错误 '{0}' expected. 应为“{0}”。1006 错误 A file cannot have a reference to itself. 文件不能引用自身。1009...原创 2020-05-01 18:34:09 · 13146 阅读 · 2 评论 -
记录vue+ts项目引入echarts方法
第一种indext.html中用script引入<script src="https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts-en.common.min.js"></script>组件中调用方式<script >import { Component , Vue } from 'vue-prop...原创 2020-04-27 15:03:06 · 14868 阅读 · 3 评论 -
vue+TypeScript构建第一个项目
安装项目因为本机vue脚手架是2.0,webpack3.0版本所以本文只适用vue/cli2.0版本。//新建项目vue init webpack vue-ts后面一系列路由,测试单元配置忽略。//新建项目后我们安装tsnpm install typescript ts-loader --save-dev//安装一下官方插件npm i vue-class-c...原创 2020-04-27 10:42:01 · 9946 阅读 · 0 评论 -
ES6 (二) 解构赋值
概述解构赋值是对赋值运算符的扩展。他是一种针对数组或者对象进行模式匹配,然后对其中的变量进行赋值。在代码书写上简洁且易读,语义更加清晰明了;也方便了复杂对象中数据字段获取。解构模型在解构中,有下面两部分参与:解构的源,解构赋值表达式的右边部分。 解构的目标,解构赋值表达式的左边部分。数组模型的解构(Array)//基本操作let [a, b, c] = [1, ...原创 2020-04-24 15:54:08 · 1725 阅读 · 0 评论 -
ES6 (一) let 与 const
let 声明的变量只在 let 命令所在的代码块内有效,切不能重复声明。const 声明一个只读的常量,一旦声明,常量的值就不能改变。对比三中声明变量的方式,我们举一个通俗点的例子var 像是一个渣男,可以随意劈腿和找小三。let 像是一个暖男,只有分手以后才会另寻新欢,绝对不会劈腿。const 像是一个直男,一辈子不会劈腿,从一而终。let 命令基本用法:{ ...原创 2020-04-24 15:47:41 · 1317 阅读 · 0 评论 -
前端在线预览excel、word、pdf、ppt
这里主要推荐两种官方提供的API.第一是微软提供API,调用方法如下,支持('.ppt''.pptx''.doc','.docx','.xls','.xlsx')格式。http://view.officeapps.live.com/op/view.aspx?src=[OFFICE_FILE_URL]<iframe src='https://view.officeapps.liv...原创 2020-04-22 10:59:17 · 4225 阅读 · 0 评论 -
echart坐标轴添加下划线问题
echart坐标轴是不支持HTML标签渲染的,但是项目要求给可点击的坐标轴文字添加标签。下面提供一种曲线求国的方式来实现坐标轴添加下划线需求。axisLabel:{ color:'#fff', fontSize:16, backgroundColor: { image: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAA...原创 2020-04-15 14:28:33 · 3485 阅读 · 0 评论 -
js 判断数据类型
一、JS中数据类型基本数据类型(Undefined、Null、Boolean、Number、String) 复杂数据类型 (Object)二、判断数据类型下面将对如下数据进行判断它们的类型var bool = truevar num = 1var str = 'abc'var und = undefinedvar nul = nullvar arr = [1,2,...原创 2019-12-12 11:30:44 · 9635 阅读 · 0 评论 -
Node.js+vue项目中使用AES实现密码加密解密(ECB和CBC两种模式)
区别ECB:是一种基础的加密方式,密文被分割成分组长度相等的块(不足补齐),然后单独一个个加密,一个个输出组成密文。CBC:是一种循环模式,前一个分组的密文和当前分组的明文异或或操作后再加密,这样做的目的是增强破解难度。(不容易主动攻击,安全性好于ECB,是SSL、IPSec的标准)代码实现 先安装crypto-js npm install crypto-js --s...转载 2019-11-13 16:17:53 · 3504 阅读 · 0 评论 -
Vue中的render函数
render function 类型:(createElement: () => VNode) => VNode 详细: 字符串模板的代替方案,允许你发挥 JavaScript 最大的编程能力。该渲染函数接收一个 createElement 方法作为第一个参数用来创建 VNode。 如果组件是一个函数组件,渲染函数还会接收一个额外的 context 参数,为没有...原创 2019-10-24 09:12:32 · 9725 阅读 · 0 评论 -
Vue开发小技巧
Vue 3.x 的Pre-Alpha 版本。后面应该还会有 Alpha、Beta 等版本,预计至少要等到 2020 年第一季度才有可能发布 3.0 正式版;所以应该趁还没出来加紧打好 Vue2.x 的基础;Vue基本用法很容易上手,但是有很多优化的写法你就不一定知道了,本文从列举了 36 个 vue 开发技巧;后续 Vue 3.x 出来后持续更新.1.require.context()...原创 2019-10-14 14:05:32 · 2481 阅读 · 0 评论 -
JavaScript 提升性能小技巧
1.惰性载入函数function foo (){ if(a!==b){ console.log('aaa') }else{ console.log('bbb') }}//优化后function foo (){ if(a!=b){ foo = function(){ conso...原创 2019-10-14 10:16:57 · 9651 阅读 · 0 评论 -
vue复用组件 不刷新的解决方案
vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用。vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来。传统的页面应用,是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中,则是路径之间的切换,也就是组件的切换。 对于路由,不同的路由跳转,vue会帮我们刷新路由,但是我今天...原创 2019-08-17 11:35:57 · 15531 阅读 · 0 评论 -
npm包发布
首先新建vue项目vue init webpack-simple ly-first-vue在assets中新建ly-first-vue.vue文件和index.js文件然后编写组件,简单的循环一个列表ly-first-vue.vue<template> <ul> <li v-for="(item, index) ...原创 2019-08-08 15:06:47 · 9628 阅读 · 2 评论 -
vue在IE浏览器下报错Failed to generate render function:SyntaxError: 缺少标识符 in
IE11浏览器 以上是报错信息这个报错实在是看不懂,IE浏览器的报错信息一直这么与众不同;查了很多资料,最后发现很简单只要把{node,data}换为一个对象名称即可。//{ node, data }替换成下面代码即可{ scope.node, scope.data }...原创 2019-07-12 16:34:34 · 9573 阅读 · 3 评论 -
vue 特殊路由设计
在 vue-router 的使用中,有时会面临这样一个问题,那就是 vue-router 的设计要求component层级和route层级保持一致。const route = { path: '/list', name: 'list', component: List, children: [{ path: 'detail/:id', name: 'de...原创 2019-07-11 10:10:00 · 10228 阅读 · 0 评论 -
element 表单验证只能输入正整数
<el-input type="number" v-model="ruleForm.goods_rules" onkeypress="return( /[\d]/.test(String.fromCharCode(event.keyCode) ) )" autocomplete="off" placeholder="请输入规格型号"></el-input>...原创 2019-07-09 09:33:44 · 11005 阅读 · 0 评论 -
vue回车键登陆
created() { let that = this; document.onkeypress = function(e) { var keycode = document.all ? event.keyCode : e.which; if (keycode == 13) { that.login();// 登录方法名 ...原创 2019-07-07 13:49:48 · 3910 阅读 · 0 评论 -
node 本地部署vue项目
以express为例:var createError = require('http-errors');var express = require('express');var path = require('path');var cookieParser = require('cookie-parser');var logger = require('morgan');var h...原创 2019-06-28 09:17:54 · 3092 阅读 · 0 评论