- 博客(36)
- 资源 (1)
- 收藏
- 关注
原创 html2canvas 生成图片丢失问题及解决方案
本文总结了使用html2canvas生成图片时常见的元素丢失问题及解决方案。主要问题包括:网络图片跨域、元素高度截断、CSS3动画显示延迟、文字溢出隐藏、iOS兼容性问题、表格边框异常、长页面显示不全以及图片加载超时等。针对每种问题,提供了具体的配置参数和代码示例。最佳实践建议包括确保图片资源正确加载、简化DOM结构、测试不同设备等。通过合理配置和优化,可以有效解决html2canvas生成图片时的各种显示问题。
2025-08-08 09:36:45
834
原创 vuedraggable在iframe中无法使用问题
摘要:在Vue.js中使用draggable组件时,若页面包含iframe元素,拖动操作可能被iframe拦截。解决方法是在拖动开始时将iframe的pointerEvents设为"none"禁用其事件响应,拖动结束后再设为"auto"恢复。关键代码通过$parent.$refs获取iframe引用,并在onDragStart/onDragEnd事件中控制pointerEvents属性,其中onDragEnd使用setTimeout延迟100ms确保拖动完全结束。该方
2025-07-05 16:02:19
233
原创 html2Canvas不支持object-fit属性导致图片变形了
摘要:为解决html2Canvas不支持object-fit属性的问题,本文提供了一种替代方案。通过JavaScript动态计算图片尺寸和位置,实现类似object-fit的填充效果。主要步骤包括:监听图片加载完成、计算图片与容器比例、根据比例差异设置合适尺寸和居中位置,最终通过绝对定位实现完美填充。该方法不依赖object-fit属性,兼容性更好。
2025-06-30 21:10:09
120
原创 vue动态页面快照截图 html2canvas
本文介绍了使用html2canvas在Vue中实现高分辨率截图的方法。通过创建隐藏的SnapshotPage组件(2400x3600px),在其中渲染动态内容,利用html2canvas进行截图并转换为文件。关键点包括:1)将截图区域定位在屏幕外而非display:none;2)确保组件不透明但不可见;3)截图完成后通过事件触发文件上传。这种方法适合需要将动态内容转为高清图片的场景,同时不影响用户体验。
2025-06-27 14:42:49
246
原创 Vue 二维码组件
摘要:本文介绍了Vue-QR插件的安装和使用方法。通过npm install vue-qr --save安装后,在组件中导入并注册VueQr。使用时可通过配置项自定义二维码样式,包括大小(300)、边距(25)、颜色(前景色#ce8d5e/背景色白色)、圆角(10px)和点缩放比例(0.9)等。该插件基于Awesome-qr.js库开发,项目地址和参考文档可通过提供的GitHub链接获取
2025-06-18 20:48:26
148
原创 cursor-0.45版本不能用了吗
Free & free trial accounts can no longer use chat with premium models on Cursor Version 0.45 or less. Please upgrade to Pro or use Cursor Version 0.46 or later. Install Cursor at https://www.cursor.com/downloads or update from within the editor.
2025-04-07 09:48:35
662
3
原创 mac 终端 code . 报错command not found: code
【代码】mac 终端 code . 报错command not found: code。
2024-12-12 11:32:26
636
原创 [email protected] postinstall: `node scripts/build.js`
vue下载依赖报[email protected] postinstall: `node scripts/build.js`错误
2024-12-05 10:18:30
653
原创 ill,contain,cover,none,scale-down 区别
scale-down: 保持原有尺寸比例,如果容器尺寸大于图片内容尺寸,保持图片的原有尺寸,不会放大失真;容器尺寸小于图片内容尺寸,用法跟contain一样。cover: 保持原有尺寸比例。宽度和高度中长的那条边跟容器大小一致,短的那条等比缩放。可能会有部分区域不可见。contain:保持原有尺寸比例。长度和高度中短的那条边跟容器大小一致,长的那条等比缩放,可能会有留白。内容拉伸填满整个content box, 不保证保持原有的比例。none: 保持原有尺寸比例。同时保持替换内容原始尺寸大小。
2024-07-16 17:43:33
512
原创 Promise.all当有一个请求失败时 导致所有后续的处理都停止优化方案
在您的代码中,使用 Promise.all 来处理多个异步请求(这里是获取图片URL)是一个常见且有效的方法。但是,当其中一个请求失败时,Promise.all 会立即拒绝整个Promise数组,导致所有后续的处理都停止。为了优化这一点,您可以使用 Promise.allSettled 来代替 Promise.all,这样即使某个请求失败,其他请求仍然可以继续执行,并且您可以在所有请求完成后处理每个请求的结果(无论成功还是失败)
2024-07-12 09:21:57
1886
原创 vue多列表前端分页
如果每个对象里的 tableData 是一个列表,并且你想要为每个这样的列表实现独立的分页功能,你需要为每个对象维护一个独立的分页状态。这通常意味着你需要在你的 Vue 组件的 data 函数中为每个对象或每个分页状态创建一个独立的变量,但这在实际操作中可能不太方便。一个更实用的方法是使用一个数组或对象来存储每个 dataList 对象的分页状态。
2024-07-09 18:04:21
327
原创 element Tree 树形控件default-expanded-keys 将指定节点的父级都展开
element Tree 树形控件default-expanded-keys 将指定节点的父级都展开
2022-07-15 11:08:45
3013
原创 gitlab项目完整迁移
1.克隆自己服务器的代码git clone --mirror 原项目仓库地址 会生成一个.git文件2.在.git 文件根目录执行下面命令git push --mirror 新代码仓库地址 将本地克隆的代码推到新的服务器3.在项目根目录执行git remote set-url origin 新地址//将本地远程仓库地址改为新地址迁移完毕...
2021-04-05 10:02:27
751
1
原创 React调用百度富文本存在的一些问题
项目场景:react 项目中要使用百度富文本具体流程:打开百度富文本官网https://github.com/fex-team/ueditor#ueditor将源码克隆下来在此文件夹下来执行下面命令//如果电脑没有安装grunt 执行以下第一个命令npm install grunt -g//然后给ueditor安装依赖npm install//再执行grunt default这两就是被grunt default 出来的文件将这个utf-8-php 文件夹改名为ued
2021-03-27 17:22:08
441
转载 git基本常用命令
一、新建代码库# 在当前目录新建一个Git代码库$ git init# 新建一个目录,将其初始化为Git代码库$ git init [project-name]# 下载一个项目和它的整个代码历史$ git clone [url]二、配置# 显示当前的Git配置$ git config --list# 编辑Git配置文件$ git config -e [--global]# 设置提交代码时的用户信息$ git config [--global] user.name "[na
2020-12-27 13:58:02
116
原创 axios同步请求问题
项目场景:在开发动态表单请求回来的数据可能遇到select时需要发请求去获取select里的值,这个时候使用axios发请求会异步问题描述:如下图小democonst val = [ { name: 'sss' }, { name: 'aaa' }, { name: 'bbb' }, { name: 'ccc' }, { name: 'ddd' }, ] const handleOk = () =>
2020-12-23 00:05:25
744
原创 字符串中是否存在中文正则
判断字符串中是否存在中文let value = 'asdasd阿斯顿'let reg = new RegExp("[\\u4E00-\\u9FFF]+","g");let flag = reg.test(value) //true
2020-12-20 10:59:59
654
1
原创 vue项目打包清除console
第一步第二步代码送上plugins: [ // http://vuejs.github.io/vue-loader/en/workflow/production.html new webpack.DefinePlugin({ 'process.env': env }), // 打包去除console new UglifyJsPlugin({ uglifyOptions: { compress: {
2020-12-19 19:29:04
651
1
原创 string.replace()默认只替换第一个
var arr = '200,234,455'console.log(arr.replace(/,/g,'-')) //200-234-455//当然可以用下面方法console.log(arr.split(',').join('-'))//200-234-455
2020-12-18 18:43:05
2381
1
转载 数组的基本操作方法
数组奇巧淫技文章目录数组奇巧淫技怎么创建一个数组数组的浅拷贝数组解构赋值应用数组的去重数组的合并数组取交集数组取差集数组怎么转对象对象转数组对象转数组数组得常用遍历检测数组所有元素是否都符合判断条件检测数组是否有元素符合判断条件找到第一个符合条件的元素/下标怎么创建一个数组const arr = new Array(100).fill(1).map((item,index) => index+1)const arr = Array.from(Array(100),(a,b)=>b+
2020-12-16 23:08:13
416
原创 react form.list设置默认值
项目场景:创建投票用到antd里的form.list 组件 新增一条问题描述:我在form.list 的一个formItem里有一个图片上传组件,我想上传完图片后把图片地址绑定到这个formItem上,之前我就用了form.setFieldsValue({votingOptions:[subjectUrl:item?.response?.realUrl]})但是这么写完之后虽然图片的值是绑定上了,但是这个form.list里还有另外两个输入框,这两个控件的值会被重置 原因分析:因为设置值
2020-12-15 23:54:41
4094
3
原创 js防抖 节流
js 防抖 节流debounce(防抖)触发高频时间后n秒内函数只会执行一次, 如果n秒内高频时间再次触发, 则重新计算时间。防抖常应用于用户进行搜索输入节约请求资源,window触发resize事件时进行防抖只触发一次。const debounce = (fn, time) => { let timeout = null; return function() { clearTimeout(timeout) timeout = setTime
2020-12-05 11:12:09
175
原创 macos 微信小助手
macos 微信小助手文章目录macos 微信小助手前言一、主要功能?二、怎么安装1.安装方式一:普通安装(clone最新版本并安装)2.安装方式二:懒癌版安装三、怎么卸载卸载方式一:自动卸载(推荐)卸载方式二:手动卸载总结前言提示:WeChatExtension完全免费。提示:以下是本篇文章正文内容,下面案例可供参考一、主要功能?迷离/黑夜/深邃/少女 皮肤模式僵尸粉检测手机端也能收到被撤回的消息消息转发免认证登录与多开同时支持自定义回复和AI自动撩妹显示小程序详情Alf
2020-12-05 07:50:28
941
原创 axios与request的区别
axios与request的区别发送数据类型的区别axios 会根据要发送的数据来设置合理的Content-type,默认是application/json// data 是作为请求主体被发送的数据// 只适用于这些请求方法 ‘PUT’, ‘POST’, 和 ‘PATCH’// 在没有设置 transformRequest 时,必须是以下类型之一:// - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
2020-12-03 23:37:22
10040
1
vue项目实现多图片批量裁剪功能
2025-01-10
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人