不怕麻烦的鹿丸的博客

canvas自定义文本排列方法 + 自定义花字应用案例

模拟mac系统的滚动条样式，鼠标滚动显示，不滚动则消失。

一个可以解析获取本地excel文件和txt文件的按钮组件，可以自定义插槽内容。

在一些项目中，登录机制是双token机制，即有一个短期token（一般设置为30分钟过期），还有一个刷新token（过期时间比较长，可能1天或多天），用于去重新获取新的短期token。前端的无感刷新技术实现原理主要是，通过axios的拦截器，在响应拦截里获取到后端接口的返回码，根据返回码判断短期token是否过期。若短期token过期，则去请求判断刷新token是否过期的接口，如果刷新token过期，则返回登陆页面。

【代码】tensorflow 在 vue 项目中使用示例。

在例如相机监听事件onCameraFrame里，最好是每一帧的数据更新操作上在setDate的回调里处理，，防止多次setDate，但数据还没更新完下一帧的setDate又进来，导致堵塞。清除张量，tf.dispose()在web端生效，在小程序端不能清除张量占用空间，需要挨个清除tensor.dispose()或者tf.dispose(tensor)防止内存溢出，特别是在ios上。

简单来说，RTCDataChannel 就是在点对点连接中建立一个双向的数据通道，从而获得文本、文件等数据的点对点传输能力。它依赖于流控制传输协议（SCTP），SCTP 是一种传输协议，类似于 TCP 和 UDP，可以直接在 IP 协议之上运行。但是，在 WebRTC 的情况下，SCTP 通过安全的 DTLS 隧道进行隧道传输，该隧道本身在 UDP 之上运行。另外总的来说 RTCDataChannel 和 WebSocket 很像，只不过 WebSocket 不是 P2P 连接，需要服务器做中转。

cookie的存储空间非常有限且会携带在请求头中会浪费不必要的流量，如果仅仅是为存储数据，可以采用其他替代方案，例如 webStorage，

if(/%/ig.test(px)) { // 有百分号%，特殊处理return px} else {// 144 为设计图尺寸1440除以10。

一、开发环境配置1、安装node.js通过官网下载安装node.jshttp://nodejs.cn/在用 Vue 构建大型应用时需要使用到node里面的 npm 来安装各种插件Node 版本要求Vue CLI 4.x 需要Node.jsv8.9 或更高版本 (推荐 v10 以上)。你可以使用n，nvm或nvm-windows在同一台电脑中管理多个 Node 版本。2、npm配置淘宝镜像如果在本地一直装不上npm的包，可以考虑用国内的淘宝镜像，使用淘宝定制的 ...

HTML5 提供了一种简单而强大的方式来实现视频录制和上传功能。通过使用 HTML5 的video元素和接口，我们可以在浏览器中录制视频，并将其上传到服务器。

按照。

【代码】js修改浏览器地址栏里url的方法。

/ 传入数组，以及要交换位置的2个元素的下标return arr。

【代码】小DEMO：在vue中自定义range组件。

使用canvas，模拟绘制时间轴区域，有时间刻度标尺，时间轴区域上会有多行，每行都有一个滑块。1、时间刻度标尺可以拖动，会自动对齐整数点秒数，最小步数为0.1秒。2、滑块可以自由拖动，当滑块处于选中状态时，左右两边会出现可拖动的按钮，用于拉伸宽度。3、滑块与滑块之间对齐时会出现对齐虚线，滑块与刻度标尺对齐时，刻度标尺会变色用于提醒用户此时已对齐。4、当滑块拉伸到最右侧区域时，右侧空间不足时，会自动增加右侧空间区域。

Blob链接是一种基于URL.createObjectURL(blob)生成的链接，可以将文件或数据的内容转换为URL的形式，方便进行下载或者展示。Blob链接可以是二进制数据、音频、视频、图像等。

打开 vscode 新建一个 components 目录并新增一个button目录，然后再建一个__test__目录放测试文件，elemetn-plus 源码也是这样做的，在里面新建一个xxx.test.ts 或者 tsx 的文件（没安装tsx就建ts文件）。如果没安装c8，运行命令的话，Vitest 会提示安装 c8，默认yes，回车执行安装。vitest默认会检测项目中所有.test.ts或者.test.tsx等之类的测试文件，这个是可以修改的，具体配置可以参考官网去改。在 vitest 中 集成了。

直接在对应的标签上使用 css 中的 fontFamily 赋值你定义的字体名字即可。加载字体文件主要用到 FontFace 这个对象。检测字体文件是否已加载。

【代码】JavaScript中获取屏幕，窗口和网页大小。

【代码】JS 中 RGBA 四通道颜色的叠加计算方法。

销毁 VIDEO 元素意味着停止视频的播放，并释放与其相关的所有资源。一般情况下，我们可以通过调用 VIDEO 元素的 pause() 方法来停止视频播放，然后使用 remove() 方法从 DOM 树中删除元素。但是，仅仅这样做可能并不能完全卸载 VIDEO 元素。如果视频正在播放或者已经加载了部分数据，那么该元素仍然会持有资源，因此可能会导致内存泄漏。为了彻底卸载 VIDEO 元素，我们需要将其赋值为 null，并且同时删除所有相关事件监听器和其他引用。

一些简单有规则的图形，比如矩形，椭圆，多边形......我们可以使用一些数学函数来计算判断。这种方式非常棒，当你的画布上没有大量的图形时，他可能是非常快的。但是这种方式很难处理那些非常复杂的几何图形。比如说，你正在使用具有二次曲线的线。

mousedownmouseupmousemovemouseleave用户在同一个位置先完成mousedown动作，再完成mouseup动作。因此，触发顺序是，mousedown首先触发，mouseup接着触发，click最后触发。会在mousedown、mouseup、click之后触发。都是鼠标进入一个节点时触发。两者的区别是，mouseenter事件只触发一次，而只要鼠标在节点内部移动，mouseover事件会在子节点上触发多次。都是鼠标进入一个节点时触发。

1.获取localStorage的长度：window.localStorage.length2.添加/编辑localStorage的内容：window.localStorage.setItem(键,值);3.根据对应的索引去获取对应localStorage的key的值：window.localStorage.key(索引);4.根据对应的key获取对应的的value：win

假如我们想使用第三方库 jQuery，一种常见的方式是在 html 中通过标签引入 jQuery，然后就可以使用全局变量或jQuery了。我们通常这样获取一个id是foo$('#foo');// or但是在 ts 中，编译器并不知道或jQuery这时，我们需要使用上例中，并没有真的定义一个变量，只是定义了全局变量jQuery的类型，仅仅会用于编译时的检查，在编译结果中会被删除。除了之外，还有其他很多种声明语句，将会在后面详细介绍。通常我们会把声明语句放到一个单独的文件（

一、TS 文件的加载策略TS 中的加载策略分为两种方式，分别为相对路径和绝对路径两种方式。1、相对路径TypeScript 将 TypeScript 源文件扩展名（.ts、.tsx和.d.ts）覆盖在 Node 的解析逻辑上。同时TypeScript 还将使用package.jsonnamed 中的一个字段types来镜像目的"main"，编译器将使用它来查找“主”定义文件以进行查阅。

严格大于0的数字数组，其中1表示常速（100％），0.5表示半速（50％），2表示双速（200％）等。markerStyle配置的是各个打点的默认颜色，如果要每个打点都有自己各自的颜色，可以在markers里给每个打点添加class名字，然后在css里单独设置颜色。Video.js表示用户通过"vjs-user-active"和"vjs-user-inactive"类以及"useractive"事件与玩家进行交互。此选项将用于Video.js（即video.novtt.js）的“novtt”版本中。

数据模板中的每个属性由 3 部分构成：属性名、生成规则、属性值// 属性名 name// 生成规则 rule// 属性值 value属性名 和 生成规则 之间用 |分隔。生成规则 是可选的。生成规则 有 7 种格式：生成规则 的 含义 需要依赖 属性值 才能确定。属性值 中可以含有 @占位符。属性值 还指定了最终值的初始值和类型。1、属性值是字符串String通过重复'value'生成一个字符串，重复次数大于等于min，小于等于max。通过重复'value'

该方法可以用来读取文本文件，这个文件有两个参数，第一个参数用来读取File对象或Blob对象。该方法读取文件后，会在内存中创建一个ArrayBuffer对象（二进制缓冲区），将二进制数据存放在其中。onprogress：读取过程中触发，会返还本次读取文件的最大字节数和已经读取完毕的字节数，可以用来做进度条。2. fileReader对象 读取不同文件调用的方法不同，所以要创建正则判断读取文件类型。该方法可以终止任何操作，在读取大文件的时候，这个方法能派上用场。按字节读取文件内容，结果为文件的二进制串。

将table标签，包括tr、td等标签对json数据进行拼接，将table输出到表格上实现导出。通过对json格式的数据进行遍历，字符串拼接，通过a标签将拼接好的字符串输出到csv文件。弊端：输出的是伪excel，虽然生成后缀为xls的文件，但文件形式上还是html。\t ：为了不让表格显示科学计数法或者其他格式。, ：每一个逗号就是隔开一个单元格。

1、base64加密在页面中引入base64.js文件，调用方法为：<!DOCTYPE HTML><html> <head> <meta charset="utf-8"> <title>base64加密</title> </head> <b...

当 arguments 对象开始执行时，它会为每个函数进行实例化。 arguments 对象只能在其关联函数的范围内直接进行访问，实际上是当前函数的一个内置属性。您可以使用 arguments 对象来创建可接受任意个参数的函数。 这一功能还可以通过在定义函数时使用参数数组结构来实现。一、在函数代码中，使用特殊对象 arguments，我们无需明确指出参数名，就能访问它们

1.window.location.href = “url”（跳转）改变url地址，可以使用window.history.go(-1)和wondow.history.back()来返回上一个页面。2.window.location.replace(“url”) （替换）将地址替换成新的url地址，该方法通过指定URL替换当前缓存在历史里（客户端）的项目，因此当使用replac