React
由本
逆水行舟 不进则退---
展开
-
钉钉应用接入、免登、前端,简单易懂,省去你翻阅文档的时间
钉钉应用接入、免登、前端部分原创 2024-04-12 10:47:14 · 383 阅读 · 0 评论 -
(前端) 获取当前浏览器类型、获取IE浏览器版本
/*** * 获取当前浏览器类型 */export const myBrowser = () => { const userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 const isOpera = userAgent.indexOf("Opera") > -1; if (isOpera) { //判断是否Opera浏览器 return "Opera" } if (userAgent.indexOf("原创 2021-11-13 17:27:58 · 1250 阅读 · 0 评论 -
(前端) 获取上周上月上半年上一年,获取前几天、后几天、当天
import moment from "moment"/*** * 获取上周上月上半年上一年 * @param flag * 1 上周 * 2 当月 * 3 上一月 * 4 上半年 * 5 近一年 * 6 上一年 */const getDate: any = (flag: string) => { let obj: any = { beginDate: '', endDate: '' } const now = new Date(); //当前日期原创 2021-11-13 16:12:25 · 380 阅读 · 0 评论 -
(前端React)手写签名 react-canvas-draw
import CanvasDraw from 'react-canvas-draw'const signCanvas = useRef<any>();// 清空signCanvas.current.clear()// 获取结果const img = signCanvas.current.canvas.drawing.toDataURL('image/png')<div> <div className="backageImg"></div>原创 2021-11-13 14:39:59 · 893 阅读 · 1 评论 -
(前端)录音功能实现 js-audio-recorder
1. 创建import Recorder from 'js-audio-recorder'const parameter = { sampleBits: 16, // 采样位数,支持 8 或 16,默认是16 sampleRate: 8000, // 采样率,支持 11025、16000、22050、24000、44100、48000,根据浏览器默认值,我的chrome是48000 numChannels: 1 // 声道,支持 1 或 2, 默认是1}const recorderEx原创 2021-11-13 14:07:51 · 7253 阅读 · 3 评论 -
(前端)file、blob、base64相互转换
blob转fileconst blob = '.....'const file = new File([blob], 'name.wav', {type: 'audio/wav'});blob转base64const blob = '.....'const a = new FileReader();a.readAsDataURL(blob);a.onload = (e) => { const base64 = e.target.result}blob转blobUrlcons原创 2021-11-10 17:04:17 · 2418 阅读 · 0 评论 -
(前端)前后端“文件流”,上传、接收、下载
文件上传(两种)方法1 -- 表单方式上传通过input拾取到文件获取fileconst formData = new FormData() formData.append('file', file)request(`/mark/...`, { method: 'POST', headers: { 'Content-Type': 'multipart/form-data', }, data: formData})方法2 -- base64字符串上传let原创 2021-11-10 14:32:45 · 3183 阅读 · 0 评论 -
打包&配置&优化--备忘录
一、打包环境区分1、正常/ * npm start */ process.env.NODE_ENV === 'production',/ * npm run build */ process.env.NODE_ENV === 'development'2、额外环境区分打包配置package.json中配置命令⬇️ "build-pro": "REACT_APP_ENV=pro 打包执行代码" "build-dev": "REACT_APP_ENV=dev 打包执行代码"等号前面原创 2021-05-13 17:10:03 · 226 阅读 · 0 评论 -
React+TypeScript+Hooks+Umi+Dev+Ant Design(笔记篇)
Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。// interface.ts文件,一般用于存放ts类型export interface ItemType { name: string age: number | number // | 标示或 fn1: () => void // 无参数,无返回值 fn2: (parame: number) => number // 数字格式参数且返回值原创 2021-04-25 14:48:11 · 679 阅读 · 0 评论 -
大文件断点续传/切片上传(react、vue通用)
----整体流程解析 - 1断点续传首先要满足的功能是第一次上传30%关闭上传后,再次上传此文件继续从30%开始继续上传。要想满足此功能,首先要做的是把一个文件切割成多份上传,而每次上传时,后台需要告诉你此文件已经上传了多少份。例:A文件(100M),切割成100份,每一份有一个id,如1-100,第一次上传了id1-30的切片文件总计三十份,打断上传后,第二次上传时后台先告诉你已上传id1-30,前端知道后,直接从id31开始上传,做到了续传的实现。----整体流程解析 - 2功能实现至少需要后原创 2021-04-20 16:09:08 · 2412 阅读 · 1 评论 -
前端解析zip压缩包 --- vue、react等等通用
第一步:下载安装jszip插件yarn add jszip第二步: 导入插件import JSZip from 'jszip'第三步: new一个JSZip对象const zip = new JSZip()第四步: 获取内部每个文件的filezip.loadAsync(file).then((res) => { consol.log(res.files) // 每个file}) 拓展: 判断压缩包内部文件是否都是img或jpg或png或jpeg图片zip.loadAsyn原创 2021-04-20 10:47:41 · 2722 阅读 · 1 评论