- 博客(47)
- 收藏
- 关注
RSS订阅原创 ant design 3.x中upload组件 上传图片压缩
不想描述多余的，直接看代码简单直接const [defaultFileList, setDefaultFileList] = useState([]); <Upload accept="image/*" customRequest={uploadImage} onChange={handleOnChange} listType="picture-card"
2021-09-13 10:58:37
1482
原创 next 引入路径修改为@
当前项目结构预览正常效果想要达成的效果新建 jsconfig.json 写入如下代码{ "compilerOptions": { "baseUrl": ".", "paths": { "@/*": [ "./*" ], } } }再新建 next.config.js 写入如下代码const path = require("path");module.exp.
2021-08-09 17:13:39
548
原创 Node 自动发送邮件
Node 发送邮件简介版本发送者的邮箱厂商，支持列表：https://nodemailer.com/smtp/well-known/以QQ 为例子，打开邮箱，找到顶部的设置模块，然后找到下面的账户找到账户下的 POP3/IMAP/SMTP/Exchange/CardDAV/CalDAV服务然后你就发一个短信，然后点击我已发送，就会进入这个页面一定要记得这个东西然后上代码const nodemailer = require('nodemailer'); //发送邮件.
2021-08-03 15:04:54
622
原创 base64图片压缩并转换二进制流
base64 压缩function dealImage(base64, w, callback) { var newImage = new Image(); var quality = 0.6; newImage.src = base64.url; newImage.setAttribute('crossOrigin', 'Anonymous'); var imgWidth, imgHeight; newImage.onload = function() { imgWi.
2021-07-28 17:44:07
693
原创 获取当前base64的大小
const getImgSize = str => { var strLength = str.url.length; var fileLength = parseInt(strLength - (strLength / 8) * 2); var size = ''; size = (fileLength / 1024).toFixed(2); return parseInt(size);};
2021-07-28 17:40:22
957
原创 只出现一次的数字（异或版本）
本来是准备用map 写的，但是一看，我c，竟然有这种操作，太骚了，记录一下，异或操作，对于一个数字，找到唯一不重复的值，简直就是神器<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div> 给定一个非空整数数组，除了某个元素只出现一次以外，其余每个元.
2021-07-14 23:05:53
89
转载 【前端】Nodejs给没有引号的json数据添加引号
我们经常会遇到一些json数据需要放到json文件中，然后动态加载的场景。但是也经常遇到，我们拿到手的json数据的key没有引号，如果自己一个一个加，简直要累死。好在node处理json数据非常方便，我就写了一个var fs = require('fs');fs.readFile('1.json', function(err, data) { if (err) { console.log('文件读取失败'); } else { console.log
2021-07-14 22:12:47
1069
1
原创 移动端H5页面中1px边框的解决办法
在移动端web开发中，UI设计稿中设置边框为1像素，前端在开发过程中如果出现border:1px，测试会发现在某些机型上，1px会比较粗，即是较经典的 移动端1px像素问题。简书中描述很好的文章，细节可以点击进去看，如果直接想看代码实现，请看下面<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="ini.
2021-03-25 23:35:53
969
原创 删除URL中指定参数
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> </body> <script> /** * 删除当前url中指定参数 * @param names 数组或字符串 * @returns {string}
2020-12-11 22:32:42
1394
原创 力扣刷题-02-简-整数翻转
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>力扣刷题-02-简-整数翻转</title> </head> <body> <p> 给出一个 32 位的有符号整数，你需要将这个整数中每位上的数字进行反转 </p> <p> 输入: 123 输出: 321 &
2020-11-27 23:40:30
138
原创 2020-09-16 数组排序
function BubbleSort(element){ for(var i = 0;i<element.length;i++) { for(var j = 0;j<element.length-1;j++){ if(element[j]>element[j+1]){ //把大的数字放到后面 var swap = element[j]; element[j] = element[j+1]; ele
2020-11-27 13:31:06
93
原创 力扣刷题---两数之和
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>力扣刷题---两数之和</title> </head> <body> </body> <script> let nums = [2, 8, 11, 1] let target = 9 /* * 两数之和:第一种解法 * 双重for
2020-11-27 00:08:53
280
原创 Promise.all 踩坑记录
分享一个近期自己遇到的一个小问题。感觉自己真的是脑壳打铁，当时竟然卡壳了，特地记录一下需求是这样的，一个数组列表里面需要一些特地的数据，这个数据可能有很多，然后拿到特定数据的id，去请求了当前特定id 的详情，然后拿到里面的数据，再渲染回来到页面上思路大概就是拿到特定的数据，然后拿到id 去循环请求接口，嗯，由于是紧急需求，所以当前并不考虑性能的问题，然后后面这个模式其实已经修改了，因为如果数据很多的话，可能会涉及到性能问题，所以，当时就后来后端进行处理了数据let dataA=[{id:1,
2020-09-14 20:15:00
343
原创 手动实现一个防抖（deboumce）
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>防抖</title> </head> /* * 需要利用定时器， * 当我们执行这个函数时，会生成一个定时器， * 但是如果你重复执行这个函数，每次执行函数的第一步是清除上一次的定时器， * 这样就可以达成只有触发操作后超过指定的间隔说明这一次触发才有效，否则就要重新计时等待
2020-05-08 18:35:41
434
原创 手动实现函数节流（throttle）
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> /* * 函数节流 * 简单地讲，就是让一个函数无法在很短的时间间隔内连续调用，只有当上一次函数执行后过了你规定的时间间隔，、 * ...
2020-05-08 17:06:18
527
1
原创 Web Notification桌面推送消息
有一个困扰 web 用户多年的难题——丢失网络连接。即使是世界上最好的 web app，如果下载不了它，也是非常糟糕的体验。如今虽然已经有很多种技术去尝试着解决这一问题。而随着离线页面的出现，一些问题已经得到了解决。
2020-04-27 19:15:13
348
原创 3d 旋转（摘抄）
实现代码<cube> <side></side> <side></side> <side></side> <side></side> <side></side> <side></side></cube>cs...
2020-04-17 11:51:08
122
原创 input 只能输入数字和小数点，并且指定小数点后几位
let quantityScale =‘2’ let re = new RegExp('^(0|[1-9][0-9]*)(\\.[0-9]{0,' + quantityScale + '})?$'); if (re.test(e.toString()) || e === '') { /* * 满足条件 */ }
2020-04-13 16:44:33
1222
原创 js 根据url 转换图片（base64）
function getBase64(url, callback) { var Img = new Image(), dataURL = ''; Img.src = url + '?v=' + Math.random(); Img.setAttribute('crossOrigin', 'Anonymous'); Img.onload = function() { ...
2020-04-13 12:17:43
3534
1
原创 web 桌面消息推送消息
推送消息简易版本，并不会跳转到对应的页面，跳转到对应页面等下次更新``` </body><script>var n = new Notification(‘状态更新提醒’,{body: ‘你的朋友圈有3条新状态，快去查看吧’,data: {url: ‘http://www.baidu.com’}})n.onclick = fun...
2020-04-13 12:12:34
298
原创 人民币数字转大写
你是不是也遇到过这样的一个需求，就是将 人民币数字转为 大写汉字，例如下面这样其实这个很简单的，思路如下首先定义一个函数 let money=1314520const moneyTransfer=(money)=>{/** 先将传入值进行一次转换，确保是传入是数字* 不知道 parseFloat 是咋用的，看下面第一张图片，虽然我也经常忘记，哎，*/ ...
2019-11-12 23:48:34
374
原创 HB法币交易头像实现
正巧最近我在做OTC 项目，我就肯定要看一下龙头大哥，hb的做法呀，简单页面如下一开始我想到的用户头像是根据随机数来实现的，然后我就稀里糊涂的写了一个随机数实现背景颜色，代码如下/* - 背景颜色随机*/ function randomBackground(){ var r = Math.floor( Math.random()*256); ...
2019-11-12 00:17:03
432
原创 力扣刷题第二天
力扣探索初级算法给定一个整数数组，判断是否存在重复元素。如果任何值在数组中出现至少两次，函数返回 true。如果数组中每个元素都不相同，则返回 false。输入: [1,2,3,1]输出: true输入: [1,2,3,4]输出: false其实这个真的算是初级算法了，哎，可惜不是科班出身，不然我还是比较想唠嗑唠嗑的，好了废话不多说，其实这个有很多种解决办法第一种就是：循...
2019-11-09 00:21:25
273
原创 力扣-牛客刷题第一天
从排序数组中删除重复值给定 nums = [0,0,1,1,1,2,2,3,3,4],函数应该返回新的长度 5, 并且原数组 nums 的前五个元素被修改为 0, 1, 2, 3, 4。你不需要考虑数组中超出新长度后面的元素。好好想，其实这些是基础的算法问题，很简单，好好想一下就能明白，没写博客大半年了，以后基本2天更新一下，好好坚持一年，加油第一种方式，也就符合原文...
2019-11-06 00:21:28
1751
原创 React生命周期讲解
React生命周期图解先上图其实总结就是 进入当前页面，，然后渲染页面，加载数据，渲染demo，数据更新，组件卸载constructor/** constructor 其实是Es6 里面带的一个属性，代表初始化，但是组件未挂载* constructor的固定写法如下* 比如你react 需要定义一些 * State 的值就可以定义在 constructor里面，这...
2019-05-11 00:12:35
479
原创 React父子组件传值
其实react和vue传值是一样的，都是属性传值，最近技术栈都开始用react 了，第一个就是基于环信做一个即时通讯，到时候我也会上传代码进行分享第一步搭建最简单的react环境，搭建最简单的环境我也写过 地址在这里以下是基本的创建react 的代码import React, { Component, Fragment } from 'react';import './style.cs...
2019-04-11 22:19:43
1447
1
原创 网易云信IM讲解
本按钮只针对H5版本讲解,前端部分网易云信H5地址下载1 demo下载首先下载当前当前demo，并本地运行，由于网易云信提供的是采用的是node中间件的模式，所以你如果直接运行 npm run dev 是运行的打包命令，你需要运行 npm run server，来运行他当前的demo首先去网易云信控制端注册 注册完成之后，进入控制台，获取APPkey，因为这个是需要进行唯一通信的...
2019-04-08 08:55:58
4262
1
原创 vue 打包桌面应用 并发布
vue 打包桌面应用程序你说为啥现在前端这么累，一会做h5网页，一会pc网站，一会又是服务端渲染，一会又来一个桌面应用，一会又是App，是不是就差操作数据库了，不，不对，如果你是走的node 方向，那你就做到了，哈哈哈vue 打包这些流程我相信大家都已经知道了吧，不管你是vue cli 2 还是vue cli 3 打包出来都是有dist 文件的，至于前面的操作不懂的这些可以百度，多得很，我就...
2019-03-22 16:32:30
1370
原创 使用js替换数组中元素
js替换数组元素记得我最近刚刚做的一个项目，后端返回的一个数组对象，里面的图片的地址有问题，一个在这个ip上一个在另一个ip 上，我问他咋办，他说，你要自己把那个返回的数据重新修改一下就是下面这种，只替换a 中的http后面的ip 地址为当前ip地址其他保留，我去。这个要求可真烦，但是没有办法，谁叫我刚刚入职了，没办法，好吧我就来实现吧 let conter...
2019-03-17 21:13:37
25825
4
原创 vue2.x的几种通信方式
vue其实就是一个二个组件组成的，但是太多层级之后如何去通信，当组件 A 和组件 B 中间隔了数代（甚至不确定具体级别）时，以往会借助 Vuex 或 Bus 这样的解决方案，父子组件传值通信 <template> <view> <cartime :cartimebao="cartimebao"></car...
2018-12-25 17:30:24
437
1
原创 ES6的小总结
es6是新一代的JavaScript 的标准，尤其你要学习React,那就必须要学es6啊，因为不然，你压根就是蒙的，我后续也会更新react 的博客，es6的几个常用的更新一下**ForEach ** var conlors = ["red", "123", "789"] conlors.forEach(function (r) { con...
2018-12-21 17:17:49
345
原创 React脚手架搭建
React 是目前公认的前端三大框架巨头之一，也是相对学习成本高框架之一，但是为了涨工资，还是多学习一点吧React 学会了可以做很多事情，但是了，建议，如果你在做项目，大项目，建议用react，中小型项目用 vue,虽然不喜欢用angular，但是pc网站可以用，接下来开始搭建React.js 的Demo React中文网 http://react-china.org/...
2018-12-18 11:27:08
494
原创 基于vue2.0x 的即时通讯（云信版本）
即时通讯听着很难，但是了，其实也的确不简单，websocket 可以多了解一下网易云信 vue版本 https://github.com/netease-im/NIM_Web_Demo_H5可以先看看网易写的代码，的确写的很好，接下来步入正题，如果想直接用，引入例子，向下看准没有错先下载demo，中间有部分代码我都省略，到时候可以去我的github上看，直接引入自己项目，其实最容易...
2018-12-17 14:36:21
5784
2
原创 vue2.0的三种路由传参方式
为了方便自己查看，也许也能方便你学习，所以写一下vue路由跳转不外乎就三种，其实还有一种就是js 的跳转方式https://router.vuejs.org/ vue-router官网文档，相信有些同学不喜欢看官网，觉得说的云里雾里的第一种，这个用的比较少，因为需要在路由配置对应的路由配置如下 this.$route.params.sessionId ...
2018-12-05 12:05:10
1135
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人