Whatsapp 浏览器插件
免责声明: 本项目仅供学习交流使用，不得用于商业用途，如有侵权请联系删除 项目地址项目介绍项目目录12345678910111213141516171819202122⊢ dist # 打包后的文件 [插件文件]⊢ public # 静态资源文件 ⨽ images # 图片资源 ⨽ manifest.json # 插件配置文件 [重要] ⨽ inject.js # 注入脚本 [inject-script.js]⊢ src # 源码文件 ⨽ apis # 接口请求 ⨽ background # 后台脚本 [background-script.js] ⨽ init.ts # 后台脚本入口 ⨽...
Promise、Async、Await
Event Loop 这个网站很好用 JavaScript Visualizer 9000 惊艳！可视化的 js：动态图演示-事件循环 Event Loop 示例图 Promise概念 new Promise((resolve, reject) => {}) 里面的函数是同步(立刻)执行，then/catch/finally里面的函数是异步(进入微任务队列)执行 微任务队列：Promise.then/catch/finally、MutationObserver、process.nextTick、Object.observe 宏任务队列：setTimeout、setInterval、setImmediate、requestAnimationFrame、I/O、UI rendering 微任务队列优先级高于宏任务队列。在每一次事件循环中，只要调用栈为空，就会先执行微任务队列中的任务，直到微任务队列为空，再执行宏任务队列中的任务 示例 112345678910111213141516console.log(1);setTimeout(()...
前端常见的文件操作
记录一下工作中用到的文件操作 文件的预览微软的在线预览功能 注意: 文件需要能够公开访问 1234567// 前缀: https://view.officeapps.live.com/op/view.aspx?src=// url: 文件地址window.open( `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent( url )}`); 使用微软的在线预览功能预览文件 Word https://view.officeapps.live.com/op/view.aspx?src=https://cdn.zxiaosi.com/hexo/office/temp.docx Excel https://view.officeapps.live.com/op/view.aspx?src=https://cdn.zxiaosi.com/hexo/office/temp.xlsx PPT...
React 实现常见的拖拽组件
代码地址 可伸缩侧边栏 /src/components/resizeBox 手写拖拽 Modal 组件 /src/components/dragModal 使用 dnd-kit 实现拖拽组件 /src/components/dndkit 使用 dnd-kit 实现嵌套可拖动菜单 /src/components/dndkitMenu 功能演示 参考文章：【鸣谢】 Dndkit Arco Design Ant Design React 最佳实践：可拖拽侧边栏
React 使用 Tinymce 富文本
感谢 TinyMCE 中文文档中文手册 提供的文档支持。 常见功能代码地址功能演示 使用本地方式引入(跳过 API Key) 在 社区版 下载对应版本的压缩包 解压后将 tinymce 文件夹放到项目的 public 文件夹下 在 src/components/CustomEditor/index.tsx 中找到 tinymceScriptSrc, 然后引入本地的 tinymce 文件 1234567<Editor ..., init={{ ..., tinymceScriptSrc={'/tinymce/tinymce.min.js'} }}/> 注意: 一定要放在 public 文件下, 否则会被打包, 导致找不到文件 下载语言包 在 语言包下载地址 找到需要的语言包并下载 解压后将 langs 文件夹放到项目的 public 文件夹下 在 src/components/CustomEditor/index.tsx 中找到 language,...
