代码片段
pubdate:2020-10-20 14:39:50
tags:代码片段
简短而又有用的一些代码片段，一般都是 ts 版本 可以利用 typescript playground 很方便的将 ts 的代码转为 js 的代码然后使用
依赖浏览器 dom
ts
// 复制文本
export const copy = (str: string) => {
// 第一种 这个在控制台中直接用会报错 Uncaught (in promise) DOMException: Document is not focused.
navigator.clipboard.writeText(str);
};
export const copy2 = (str: string) => {
// 第二种 这个可以直接在浏览器控制台内使用
const input = document.createElement("textarea");
input.style.opacity = "0";
document.body.appendChild(input);
input.value = str;
input.select();
const r = document.execCommand("copy");
input.remove();
return r;
};
纯粹无依赖
Array
数组求和
typescript
/** 数组求和 */
export function ArraySum(arr: T[], f: (el: T) => number) {
return arr.map(f).reduce((a, b) => a + b, 0);
}
数组取随机 n 个元素
typescript
/** 从数组中随机取 n 个元素 */
export function sampleSize([...arr]: T[], n = 1) {
let m = arr.length;
while (m) {
const i = Math.floor(Math.random() * m--);
[arr[m], arr[i]] = [arr[i], arr[m]];
}
return arr.slice(0, n);
}
今天（2020-11-17）发现 GitHub 的消息那里的分页也是存在问题的，就是在一开始如果有两页数据一直点已读然后点下一页发现是空的，再点上一页才能看见消息
数组去重 ＆ 求和
typescript
/** 数组去重
* 1. 可以设置函数来决定什么样算重复
* 2. 可以设置函数来决定遇到重复的结果该怎么合并
*/
export function Array去重(
arr: T[],
/** 需要返回该对象的一个唯一标识（需要是原始值 用于和其他的进行比较） */ f: (el: T) => unknown = (el: T) => el,
/** 用于决定和重复对象的合并方式，默认取后面的值，丢弃旧值 */ mergeF: (a: T, b: T) => T = (a, b) => b,
) {
let result = [] as T[];
let label = [] as unknown[];
for (const el of arr) {
const id = f(el);
const i = label.findIndex((el) => el === id);
if (i !== -1) {
result[i] = mergeF(result[i], el);
} else {
label.push(id);
result.push(el);
}
}
return result;
}
其他代码片段相关
隐藏滚动条 代码片段
CSS
.demo::-webkit-scrollbar {
display: none; /* Chrome Safari */
}
.demo {
scrollbar-width: none; /* firefox */
-ms-overflow-style: none; /* IE 10+ */
overflow-x: hidden;
overflow-y: auto;
}
将思源作为资料（音视频、图片、文本、笔记本身）管理软件，表达式插件可以实现一些资料数据的自动转化、提取、汇总
这个视频导出项目纯粹是帮助制作视频的，我以前只使用过必剪和剪映剪辑视频，感觉这些剪辑软件对于资料的复用程度很差，想要修正以前发布的视频也是很难，还有音频编辑和更换也很难
那么通过特定格式来生成视频的缺点在与特效转场之类的肯定不如专业剪辑软件，但优势在与产出快，且更新视频中的资料非常方便，减少剪辑工作量，因为我本来剪辑水平也不高，倒不如通过模板化的形式，需要优化的点可以慢慢优化，但生产视频不再需要耗时剪辑了，专注于视频内容的资料生产即可，如果能做大的话多种多样的模板也自然能够诞生
作者：llej
链接：https://ld246.com/article/1718872359226/comment/1718900624103#comments
将思源作为资料（音视频、图片、文本、笔记本身）管理软件，表达式插件可以实现一些资料数据的自动转化、提取、汇总
这个视频导出项目纯粹是帮助制作视频的，我以前只使用过必剪和剪映剪辑视频，感觉这些剪辑软件对于资料的复用程度很差，想要修正以前发布的视频也是很难，还有音频编辑和更换也很难
那么通过特定格式来生成视频的缺点在与特效转场之类的肯定不如专业剪辑软件，但优势在与产出快，且更新视频中的资料非常方便，减少剪辑工作量，因为我本来剪辑水平也不高，倒不如通过模板化的形式，需要优化的点可以慢慢优化，但生产视频不再需要耗时剪辑了，专注于视频内容的资料生产即可，如果能做大的话多种多样的模板也自然能够诞生
作者：llej
链接：https://ld246.com/article/1718872359226/comment/1718900624103#comments
使用方式
安装 2234839/sy2video-plugin-siyuan 插件并启动 ChatTTS-ui
点击文本左侧块标最下方的转音频按钮，耐心等待一会就会在文本的下方添加一个音频块
安装 2234839/sy2video-plugin-siyuan 插件并启动 ChatTTS-ui
点击文本左侧块标最下方的转音频按钮，耐心等待一会就会在文本的下方添加一个音频块
此功能目前仅支持 ChatTTS-ui 项目的 api 接口
ChatTTS
女生音色 4351
男生 41231
https://www.blocknotejs.org/ 开源 基于块的富文本编辑器
失败的尝试
注意到思源本身提供了一个在新窗口打开块的功能：test
这个打开的效果已经很接近了，那么如何通过iframe 引用这个页面呢
使用这里的代码来生成对应链接不可行， windows.html 里面的代码依赖了 electron 环境
注意到思源本身提供了一个在新窗口打开块的功能：test
安装 2234839/sy2video-plugin-siyuan 插件后开启发布模式就可以通过 url 参数来让页面只显示指定的块
需要配置url参数：
block_show (有此参数则功能生效)
block_id
例如：http://127.0.0.1:6806/stage/build/desktop/?block_show=1&block_id=20240621163257-fp4jwg8
效果：
需要配置url参数：
block_show (有此参数则功能生效)
block_id
例如：http://127.0.0.1:6806/stage/build/desktop/?block_show=1&block_id=20240621163257-fp4jwg8
需要配置url参数：
block_show (有此参数则功能生效)
block_id
例如：http://127.0.0.1:6806/stage/build/desktop/?block_show=1&block_id=20240621163257-fp4jwg8
使用这里的代码来生成对应链接不可行， windows.html 里面的代码依赖了 electron 环境
插件可以直接调用，所以我决定使用插件实现接受 url 参数 blockId 然后弹出一个块面板，并且让窗口只显示此块面板,实现代码位于： this.addFloatLayer({
注意到思源的弹出块面板代码在这里： window.siyuan.blockPanels.push(new BlockPanel(
这个打开的效果已经很接近了，那么如何通过iframe 引用这个页面呢
但直接嵌入 ip:6806 是一个完整的编辑页面，现在我只需要引用他的一个 block 该如何做呢？
现在思源更新了发布模式，通过发布模式访问思源内容可以设置不用鉴权。
https://github.com/chidiwilliams/buzz 可在您的个人计算机上离线转录和翻译音频。 由 OpenAI 的 Whisper 提供支持。
使用方法
安装 oceanpress 插件以及 umi-ocr ,点击波浪图片修改 ocr 配置
然后在弹出来的面板中填写api地址即可使用
识别所有图片功能运行后请打开开发者面板查看进度
然后在弹出来的面板中填写api地址即可使用
识别所有图片功能运行后请打开开发者面板查看进度
安装 oceanpress 插件以及 umi-ocr ,点击波浪图片修改 ocr 配置
此次更新特别鸣谢 pisceswb 的支持。
现在 oceanpress 插件支持使用 umi-ocr 的 http api 进行图片识别了，依旧支持图片文本复制，适配思源图片ocr搜索功能。
20210816161940-zo21go13333333333333333333333333333333333333333333333333333333333333333333333333333333333
不过现在在我这没法通过这检索图片（去除保存ocr识别结果时对 !TesseractEnabled 的检测 我修改了思源源码来解决这个问题，所以等这个版本之后就可以了），但是我接通了思源的ocr搜索的，所以运气好的话你们那应该可以
使用方法
集市安装 OceanPress 插件 v0.3.6 版本以上（6月12 18点后再去装，现在集市应该还没更新），安装启用后，点击在图片的右上角菜单的最下面的 OceanPress Ocr按钮
会要求你输入 sk （因为使用的在线 api 识别，所以非常隐私的图片不要使用此 ocr）
目前可以输入 ld246 来白嫖一下...
在爱发电给我发电的（包括以前的）均可使用爱发电订单号来作为 sk 使用，每一元=10000（100次）
现在的计费是和百度一致的（百度ocr位置标准版100元/每万次），但爱发电还有抽成，所以等完善一些后我会稍微提高一点来覆盖服务器与爱发电抽成的成本
ocr识别成功后图片会有绿色边缘,这时候就可以选中复制了
修改sk在右上角的
ocr识别成功后图片会有绿色边缘,这时候就可以选中复制了
scrollIntoView 失效的原因之一 ：对该元素设置了 display: contents 。
nocodb no code db 开源的无代码数据库软件
ruff 使用 js 的嵌入式开发方案 ，开发板好贵 热度也不高
github.com/hezedu/history-navigation-vue 单页面应用上的多页导航
malagu_svelte-kit, malagu 与 svelte-kit 结合 体验地址
go 与 node.js 运行速度测试
你的代码也有一点小小的问题，我刚修改了一下在我的电脑上跑 100_000_000 个循环，go 比 node.js 略快一点点
Update main.js by 2234839 · Pull Request #1 · bearfighting/prime_test
Update main.js by 2234839 · Pull Request #1 · bearfighting/prime_test
好库 xterm.js A terminal for the web ，用来在网页中实现终端的库
她指的那个“情商高”的同学，其实是我最不喜欢的一类人。他很爱哗众取宠，油嘴滑舌，装模作样，拉帮结派的。这种人被定义为“情商高”，我也不知是什么人的主意，按照什么样的标准，但到现在，我发现中国已经遍地是这类“高情商”的人了。
windows 创建符号链接（软链接），我使用这个方法来将 singleFile 保存的网页从默认的下载目录修改到我的笔记本下的备份文件夹
mklink /d d:\res\Downloads\doc_save C:\Users\username\Documents\SiYuan\data\note\assets\web_backup
这个命令就是将 doc_save 指向 web_backup，要在以管理员身份运行的 cmd 中执行这个命令
收到赞助 网页笔记 收到了群友给的 2.22 元红包，本来发的 3.3 被群里一个开挂的抢了，后来发的专属 2.22
我这里有两种方案，一种是重载一种是类型推断
我更喜欢第二种，但存在一些问题，希望知道的朋友指点一下
ts
type p = 't' | 'h'
function test(p: 't'): number
function test(p: 'h'): string
function test(p: 't' | 'h'): number | string {
if (p == "t") {
return 3
} else {
return ""
}
}
// 这个函数的类型是符合题目要求的但内部实现会报错，我不知道该怎么在不使用 any 和 @ts-ignore 的情况下实现
function test2(p:T): T extends 't' ? number : string {
if (p == "t") {
return 3
// Type 'number' is not assignable to type 'T extends "t" ? number : string'.
} else {
//@ts-ignore
return ""
}
}
循环引用
vue reactive
useParamsObj 获取 url 参数，以及直接向对象写属性自动转换为 url