- 博客(467)
- 资源 (4)
- 收藏
- 关注
原创 根据音频绘制频谱
注意:在有些设备(iphone7)上,录音和播放不能同时进行, 在一些iphone上 同时进行回导致 播放声音音量较小。注意:在有些设备上,
2023-11-20 14:05:24 785 1
原创 react-create-app 基于 react-app-rewired scss设置全局变量全局函数
目录重写react脚手架配置使用 scss引用全局 scss 文件中的变量和函数应用全局测试重写react脚手架配置customize-cra 合并配置react-app-rewired 重写react脚手架配置安装依赖npm i customize-cra react-app-rewired -D在项目根目录下创建 config-overrides.js 文件使用 scss安装 sass npm i sass -D引用全局 scss 文件中的变量和函数应用全局npm i sass-re
2022-02-21 11:43:46 1579
原创 webpack + TypeScript搭建工程
工程搭建环境:浏览器 + 模块化webpack: 构建工具,更据人口文件找寻依赖关系,打包安装 npm i webpack webpack-cli -D安装插件npm i -D html-webpack-plugin clean-webpack-plugin webpack-dev-serverwebpack.config.js配置devServer: { open: true, port: 8000},配置命令"scripts": { "start": "npx
2021-09-30 14:32:33 367
原创 vue 数字处理规则 正整数 小数长度限制 整数长度限制
文章目录规则使用7位数字支持小数点后两位7位整数规则// 数字处理规则 小数位inputHandle(value, options) { let { obj, // 对象 key, // 修改的值对应key decimalsLen = 2, // 小数位长度 0 正整数 intLen = 0 // 整数位长度限制 0 不限制 } = options let dIndex = value.indexOf('.') // 非
2021-09-09 16:15:49 1520
原创 toLocaleString千分位
如果是超大的数,可能是会有问题的。function formatMoney(num){ return (+num).toLocaleString("en-US");}console.log(formatMoney(123456789)); // 123,456,789console.log(formatMoney(6781)) // 6,781console.log(formatMoney(5)) // 5MDN 示例...
2021-08-05 10:45:35 424
原创 生成UUID
基于URL.createObjectURLfunction genUUID() { const url = URL.createObjectURL(new Blob([])); const uuid = url.substring(url.lastIndexOf('/')+ 1); URL.revokeObjectURL(url); // 释放一个之前已经存在的、通过调用 URL.createObjectURL() 创建的 URL 对象 return uuid;}ge
2021-08-05 10:41:24 253
原创 浏览器内置 base64编码和解码 btoa atob
function utf8_to_b64( str ) { return window.btoa(unescape(encodeURIComponent( str )));}function b64_to_utf8( str ) { return decodeURIComponent(escape(window.atob( str )));}
2021-08-05 10:32:42 449
原创 js 桌面通知
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
2021-08-05 10:06:39 424
原创 node net模块 通信
net 模块回顾 http 请求普通模式三次响应 请求 响应 四次挥手长链接模式三次响应…请求 响应请求 响应请求 响应…四次挥手net 模块能干什么一个通信模块进程间的通信 IPC网络通信 TCP/IP创建客户端http://nodejs.cn/api/net.html#net_net_createconnection_options_connectlistenernet.createConnection(option[, connectListener
2021-07-01 22:01:52 364 1
原创 node 读取一个目录中所有子目录和文件
/** * 读取一个目录中所有子目录和文件 */const fs = require('fs')const path = require('path')class File { constructor(filename, name, ext, isFile, size, creeateTime, updateTime) { this.filename = filename this.name = name // 文件名 this.ext =
2021-06-27 12:13:50 1633
原创 文件 I/O fs:readFile/writeFile/stat/isDirectory/isFile/readdir/mkdir/exists
文件 I/OSync 函数是同步的,会阻塞,极其影响性能, 通常在程序启动时运行有限的次数即可.I/OI/O: input ouput 输入输出对外部设备的输入输出外部设备: 磁盘 网卡 显卡 打印机对外部数据进行传输就叫做 I/OI/O 的速度往往低于内存和 CPU 的交互速度fs 模块https://nodejs.org/dist/latest-v12.x/docs/api/fs.htmlreadFile 读取文件readFile 读取文件const fs = req
2021-06-27 11:14:24 499 1
原创 js 保证精度实现 乘法
保证精度实现 乘法function multiply(a, b) { function getSecimalsLength(num){ var str = num + '' var end = str.split('.')[1] return end ? end.length : 0 } // 判断2个参数是否有小数 比较小数长度 获取长的 var len = Math.max(getSecimalsLength(a),get
2021-06-25 18:07:21 987
原创 cesium 移动视角
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://cesium.com/downloads/cesiumjs/releases/1.82/Build/Cesium
2021-06-18 17:28:57 538
原创 数组去重
// 第一种 原数组被改变// var arr = [1, 2, 3, 4, 2, 3, 1, 5];// var ar2 = arr;// for (var i = 0; i < ar2.length; i++) {// for (var j = 0; j < ar2.length; j++) {// if (i != j) {// ...
2021-06-09 14:06:26 63
原创 手写 flat 数组降纬
/** * 数组扁平化 * @param {Number} depth 降维层级 infinty 降到一维数组 */Array.prototype.myFlat = function(depth=1){ let result = [], deep = -1; // 扁平层数 function _flat(arr){ deep++; arr.forEach((item)=>{ if(Array.isArray(item)){
2021-05-31 16:57:27 127 4
原创 手写 reduce
/** * reduce方法 * @param {*} fu 回调函数 * @param {*} initVal 初始值 */Array.prototype.myReduce = function(fu, initVal){ let prev = initVal == undefined ? this[0] : initVal; let i = initVal == undefined ? 1 : 0; for(; i< this.length; i++){
2021-05-31 16:54:45 162
原创 div实现textarea
可编辑 contenteditable=true可改变大小 resize:auto;overflow:auto;placeholder 添加placeholder属性,通过css选择器获取属性的值,添加到伪类中监听文本内容是否为空 是否显示placeholder实现过程<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv.
2021-05-31 11:40:55 603
原创 手写 功能引导实现
文章目录功能实现实现效果一实现效果二实现过程功能实现实现效果一效果配置// 首屏引导function loadHomeLead(){ // 是否已经加载过了 const is = localStorage.getItem('loadHomeLead') if(is) return const step1pos = document.querySelectorAll('.info')[1].getBoundingClientRect() const
2021-05-14 13:59:19 193
原创 typescript 编译选项
文章目录编译选项选项编译选项监听文件变化 自动编译tsc xxx.ts -wcrtl + c 关闭创建 ts 配置文件tsc - init;然后继续 编译 就会把当前目录下的 ts 文件全部编译tsc - w;选项include 定义希望被编译 文件所在的目录// 默认值 ["**/*"]// ** 任意目录// * 任意文件include: ["./src/**/*", "./test/**/*"]; // 所有src目录和test目录下的ts文件都会被编译e
2021-04-29 10:08:31 176
原创 nginx 实现负载均衡 分配策越
文章目录准备条件2个服务nginx配置负载均衡 分配策越1. 轮询(默认)2. weight 权重3. ip_hash4. fair(第三方)准备条件2个服务app.jsconst app = require('express')()app.get('/',(req, res)=>{ res.send('http://1270.0.0.1:4000')})app.listen(4000,()=>console.log('http://1270.0.0.1:4000启动'
2021-04-13 09:34:23 186
原创 node本地服务 nginx实现反向代理
node开启本地服务app.jsconst express = require('express');const app = express()app.get("/api",(req,res)=>{ res.send({text:"/api response"})})app.get("/api/first",(req,res)=>{ res.send({text:"/api/first"})})app.listen(3002,()=>{ cons
2021-04-10 09:38:12 984
原创 css 鼠标滑过闪烁效果
代码示例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&
2021-04-07 14:08:30 411
原创 一个加载小动画
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
2021-04-06 15:26:03 84
原创 nginx 配置文件
nginx 配置文件安装目录下的 conf/nginx.conf 文件nginx 配置文件由三部分组成全局块从配置文件开始到 events 之间的内容,主要设置一些影响 nginx 服务器整体运行的配置指令,主要包括配置运行 Nginx 服务器的用户(组)、允许生成的 worker process 数,进程 PID 存放路径,日志存放路径和类型以及欧洲文件的引入等。#user nobody;worker_processes 1; // Nginx 服务器并发处理服务的关键配置,worker
2021-03-31 15:09:36 127
原创 nginx 常用命令
nginx 常用命令使用nginx命令的前提条件:必须进入nginx的目录nginx -v // 查看nginx版本nginx -s stop // 停止nginx // 启动nginx -s reload// 重新加载 不是重启
2021-03-31 11:29:04 56
原创 js日期格式化 小程序 ios Date对象(好坑(:)
/** 获取指定日期的前n天 * date 当前日期 * day 前 或者 后 的日期 单位/天 * format 格式 */export function getNextDate(date, day=-1, format="yyyy-MM-dd") { return new Date(new Date(date).getTime() + day*24*60*60*1000).format(format);;};// 日期格式化Date.prototype.format = fun
2021-03-18 10:02:48 401
原创 生成 随机名称
/** * 生成文件名称 * @param {String} suffix 后缀 */export function getFileName(suffix){ return randomNumber() + '.' + suffix}// 生成随机数export function randomNumber(){ function S4() { return (((1+Math.random())*0x10000)|0).toString(16).substring(
2021-03-18 09:59:44 398
原创 uniapp 返回上一页 传参方法封装
/** 关闭当前页面传参到上一个页面 * parent_fun_name 上一个页面对应函数名称 async 方法旋转不到 * params 参数 * prev 前第几个页面 * delay 延迟关闭当前页面的时间 */export function goBack(parent_fun_name, params, prev = 1, delay=1000){ var pages = getCurrentPages(); var prevPage = pages[pages.length -
2021-03-18 09:57:00 827
原创 uniapp 支付宝小程序 ref 组件嵌套无法获取的问题
问题<template> <view class="page"> <child1 ref="enterFull"> <child2 ref="shop"></child2> // ... </child1> <view></template><script>export default{ mounted(){ console.log(this.$refs)
2021-03-11 18:30:26 2037
原创 uniapp支付宝小程序 富文本处理
官方文档根据官方文档一步步操作,还是出了问题问题原因 富文本库 wangeditor 获取的html字符串不规范// wangeditor 获取的html字符串var str = `<p>1.本券无门槛使用, 可叠加使用。<br/>2.本产品不支持退款,请谨慎购买。<br/>3.请在有效期内使用,逾期不退。<br/>4.本活动不与店内其他优惠活动同享和使用<br/>5.抢购成功后,凭核销码到店消费。<br/></p>
2021-03-11 18:19:34 847
原创 小程序 全局图片错误处理
文章目录使用示例配置main.js工具方法使用示例<swiper :indicator-dots="true" :indicator-color="dotColor" :indicator-active-color="actdotColor"> <swiper-item v-for="(item, i) in list" :key="item.id" @click="itemClick"> <view class="swiper-item"> <im
2021-01-20 16:24:29 388
原创 url变化触发popstate hasn变化触发hashChange
文章目录url变化触发hasn变化触发url变化触发window.addEventListener('popstate', function(e){ // ...})hasn变化触发window.addEventListener('hashChange', function(e){ // ...})
2021-01-14 21:51:36 547
原创 h5 canvas 合成海报
文章目录效果实现效果实现<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> bo
2021-01-12 09:45:26 657
原创 小程序 canvas合成图片 保存到相册
文章目录调用效果eyeCopy.js调用const draw = await eyeCopyFun({ cvs:this.cvs, bg:'#FFFFFF', canvasId:'poster', title:{ title:'20元代金券', validity:'2021-04-05' }, content:[ { img:{ width: 150, url:'https://weixin.hotapp.cn/src/home/img/qrcode_exa
2021-01-11 14:40:18 379
原创 uni-app 头条小程序 保存图片到相册 base64 buffer
文章目录核心代码调用核心代码// 移除文件export function removeSavedFile(filePath) { return new Promise((resolve, reject) => { uni.removeSavedFile({ filePath, success: resolve, fail: reject, }); })}// 保存图片到本地相册export function saveImgPhotosAlbum(fileP
2021-01-08 15:34:56 1128
原创 微信小程序 隐藏的调试窗口/保护代码不能进行反编译
隐藏的调试窗口微信小程序 隐藏的调试窗口 在console区域 输入命令 openInspect() apps() inspect// 选中的webview 打开一个新的窗口document.getElementsByTagName('webview')[0].showDevTools(true, null)查看基础库信息openVendor()把 wxml 编译成 htmlwcc -h // 查看有那些命令编译 index.wxml 输出到index.js (编程成
2021-01-07 09:21:59 664
原创 gulp 打包项目js混淆压缩 css压缩 html压缩
文章目录项目目录输出目录实现package.jsongulpfile.js执行命令项目目录输出目录实现package.json{ "name": "project", "version": "1.0.0", "description": "", "main": "gulpfile.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywor
2021-01-04 14:14:27 795
原创 git 忽略特殊文件
.gitignore创建一个 .gitignore 文件, 然后把要忽略的文件名填写进去,git就会自动忽略这些文件忽略文件的原则是忽略系统生成的文件忽略编译生成的中间文件、可执行文件忽略自己的带有敏感信息的文件/node_modules/distconfig.js...
2020-12-30 15:17:59 119
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人