- 博客(84)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 umi框架使用问题记录
摘要 在umi框架中实现文件下载时，由于框架会处理响应数据，导致无法获取原始arrayBuffer响应。解决方案： 配置request参数：设置getResponse:true和responseType:'arraybuffer' 使用JavaScript处理响应：通过Blob对象创建下载链接，实现文件下载功能。关键代码包括创建Blob对象、生成临时URL、创建隐藏a标签触发下载等步骤。
2025-09-08 11:13:10
274
原创 基于yjs实现协同编辑页面
协同编辑已成为现代Web应用的核心功能之一，它允许多用户实时协作，共同修改同一份文档或数据。然而，实现这一功能往往涉及复杂的冲突解决、状态同步和实时通信问题。Yjs作为一款高效的开源协同编辑框架，为开发者提供了简洁而强大的解决方案。它基于CRDT（无冲突复制数据类型）技术，确保数据一致性，同时支持与主流前端框架无缝集成。本文将介绍如何利用Yjs快速构建一个协同编辑页面，涵盖从基础原理到实际实现的完整流程。无论你是初次接触协同技术，还是希望优化现有系统，本文都能提供清晰的指引和实用的代码示例。
2025-05-26 16:46:17
1542
原创 vue3+vite+AI大模型实现谷歌插件-web诊断
谷歌插件-web诊断工具是基于vue3、vite和AI大模型技术的完美结合，工具致力于捕获页面报错信息，并为您提供高效的解决方案。
2025-05-06 14:36:37
752
原创 前端渲染pdf文件解决方案-pdf.js
是一个开源的JavaScript库，它可以在浏览器中渲染PDF文件，实现了在网页上查看PDF文档的功能。让我们一起探索pdf.js的奇妙之处，轻松实现前端PDF文件的渲染与展示吧！pdf.js是一款基于JavaScript的开源PDF阅读器组件，可以在网页中直接显示和操作PDF文件。可将pdf.js包 放到服务器上 如：http://[ip]:[port]/static/pdfjs。2）外部搜索条件触发pdf.js的搜索逻辑。【2】服务端方式（待验证）【2】服务端方式（待整理）1、pdf.js介绍。
2025-04-23 18:27:00
8421
原创 前端渲染pdf文件解决方案-@react-pdf-viewer
react-pdf-viewer 是一个基于pdfjs封装的 React PDF 阅读器组件库，提供了在 React 应用中展示和操作 PDF 文件的功能。用户可以通过该组件库轻松地在自己的应用中展示 PDF 文件，并实现诸如查看、搜索、缩放、打印等基本操作。注意：License需要花钱购买。
2025-04-17 11:32:22
1972
1
原创 vite+vue3+ts编译vue组件后，编译产物中d.ts文件为空
解决vite+ts+vite-plugin-dts实现vue组件库时，无法生成ts文件问题
2024-11-19 20:56:34
1592
原创 vue3项目报错集合
导致无法引入jsoneditor，可以使用@originjs/vite-plugin-commonjs插件解决。1. 安装插件 @originjs/vite-plugin-commonjs。2、vite.config.js 文件修改。
2024-07-29 21:44:36
2489
原创 如何使浏览器不提示记住密码
一、背景 为了系统使用安全，需要使浏览器不提示记住密码。 安全风险场景：对于公共使用的系统，A用户为了方便登录，选择了“记住密码”，B用户可以通过浏览器的密码管理查看到密码明文。二、为什么浏览器会提示记住密码？ 浏览器提示密码是根据input标签的type=“password”类型实现的。...
2024-04-24 23:09:42
2678
原创 使用webpack5+TypeScript+npm发布组件库
作为一只前端攻城狮，没有一个属于自己的组件库，那岂不是狮子没有了牙齿，士兵没有了武器，姑娘没有了大宝SOD蜜，你没有了我....言归正传，下面将给大家介绍如何通过webpack5编译一个TS组件发布到NPM平台。
2024-04-15 22:54:40
1305
原创 Echart使用水球图不生效
水球图官方链接：https://www.npmjs.com/package/echarts-liquidfill。1、Echarts的版本需要和‘echarts-liquidfill’。在vue3中使用echart5绘制水球图，未显示，也没有报错。1、安装水球图的依赖包。2、在使用的vue页面。
2024-01-26 16:54:50
809
原创 Vue3引用echart5 报错解决
一、TypeError: Cannot read properties of undefined (reading 'type')用于读取响应式对象对应的普通对象，对这个普通对象的所有操作，不会引起页面更新。作用：将一个由reactive生成的响应式对象转为普通对象。当渲染具有不可变数据源的大列表时，跳过响应式转换可以提高性能。原因：由于把echart实例绑定到了一个响应式的变量上。【1】使用markRaw 把响应式变量定为非响应式变量。作用：标记一个对象，使其永远不会再成为响应式对象。
2024-01-26 11:34:06
591
原创 Vue3动态插入组件
要渲染的实际组件，当 is 是字符串，它既可以是 HTML 标签名也可以是组件的注册名。一、使用+is实现动态组件插入。：一个用于渲染动态组件或元素的“元组件”。
2024-01-25 11:00:12
2567
1
原创 VUE引入DataV报错记录
类型“typeof import("g:/WSwork/vue-project/large-screen/large-screen/node_modules/@dataview/datav-vue3/es/index")”的参数不能赋给类型“Plugin
2024-01-25 09:49:19
5603
1
原创 Mongodb+NodeJS实现服务端架构
官网: https://www.mongodb.com/源于百度中的一段话：MongoDB是一个基于分布式文件存储的数据库。由C++语言编写。旨在为WEB应用提供可扩展的高性能数据存储解决方案。MongoDB是一个介于关系数据库和非关系数据库之间的产品，是非关系数据库当中功能最丰富，最像关系数据库的。它支持的数据结构非常松散，是类似json的bson格式，因此可以存储比较复杂的数据类型。
2023-09-14 22:27:51
502
3
原创 如何把本地项目上传github
【1】点击添加（+）-->New repository。【3】点击确定，项目已在github创建成功，如下图。【1】进入到项目文件夹，打开git branch。2）项目文件夹中出现.gitignore文件。Repository name：项目名称。Description ：项目的描述。【4】切换至github上的分支，【6】push文件到github。【3】提交文件至git本地仓库。重命名：billingSys。【2】填写新项目的配置项。【2】初始化git项目。
2023-08-26 20:41:17
1465
原创 useEffect中的函数会执行2次原因
useEffect是React18的新特性，表示React的生命周期Hooks组件。等价于Claas组件的componentDidMount、componentDidUpdate，useEffect的返回函数等价于componentWillUnmount。【1】仅在开发模式下，且使用了严格模式("Strict Mode")下会触发。生产环境模式下和原来一样，仅执行一次。为了帮助开发者提前发现重复挂载造成的 Bug 的代码。【2】之所以执行两次，是为了。一、useEffect介绍。
2023-08-05 20:32:31
4318
原创 position:sticky-粘性吸附布局
position:sticky-粘性吸附布局，就是在一个容器里,将一个子元素设置为在元素显示在,显示的效果与一致，当元素被滑动出是,显示效果与一致。
2023-05-22 20:25:33
1355
原创 报错：Error: error:0308010C:digital envelope routines::unsupported
react框架下npm run start 报错
2023-03-18 23:09:33
385
原创 React如何通过代理进行本地调测
由于在react进行本地调测时，访问后端接口会遇见跨域问题，所以我们需要通过代理的方式来解决跨域问题（服务端之间通信不存在跨域问题）本记录使用的"react": “^18.2.0”
2023-03-18 22:59:34
847
原创 JavaScript的错误类型数据
在使用JavaScript开发过程中，当我们遇见浏览器控制台中出现的报错时，如何从这些错误类型快速定位到问题代码是一种必不可少的技能，下面我们来看看JavaScript的7种错误类型（卷起来…）
2023-03-08 21:31:41
486
原创 Angular8集成Tinymce5
目录一、Tinymce5简介二、Angular8集成Tinymce5一、Tinymce5简介描述：TinyMCE是一款易用、且功能强大的所见即所得的富文本编辑器。同类插件有：UEditor、Kindeditor、Simditor、CKEditor、wangEditor、Suneditor、froala等等。官网：Tinymce 官网官网及文档(中文)：Tinymce 中文文档（不全）二、Angular8集成Tinymce5安装tinymcenpm install --save-dev tin
2021-10-28 22:26:48
1617
1
原创 数组进行异或运算
题目描述：对于两个整型数组arr1、arr2，其异或运算规则定义如下：对于arr1或arr2中的某个元素X，如果X在arr1中出现N次，在arr2中出现M次，则结果中包含|N-M|个X，其中M，N>=0，请对arr1、arr2两个数组进行异或运算，把结果按照升序排列输出：let arr1 = [1, 22, 3, 4, 55, 66,'zyk','zyk',true];let arr2 = [11, 22, 33, 44,22,22,22,22,'zyk',false,false];XO
2021-09-27 10:01:52
1836
原创 ngx-translate-lint组件
一、组件信息组件名称：ngx-translate-lintnpm仓库地址：https://www.npmjs.com/package/ngx-translate-lint组件描述：使用@ngx-translate组件实现的国际化项目，需要检查资源文件中键值是否有效，是否重复等检查工作，可以使用ngx-translate-lint组件组件作用简述：检查资源文件中键值对的键（key）是否重复；检查在资源文件中定义的键值对是否在项目中使用到；检查不同资源文件中的键是否一一对应，以中英文资源文件为
2021-09-14 09:37:07
325
原创 实现指定区域的全屏功能
一、需求描述：需要实现指定区域进行全屏显示二、原理：通过浏览器提供的方法（有浏览器差异）调用浏览器的全屏功能；浏览器 方法名 备注 requestFullScreen exitFullscreen 谷歌 webkitRequestFullScreen webkitCancelFullScreen 火狐 mozRequestFullScreen mozCancelFul...
2020-12-17 23:08:05
1260
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人