<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[lfYexun的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/lfYexun</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; lfYexun]]></copyright><item><title><![CDATA[vue2使用marked进行markdown转html]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/153186291</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/153186291</guid><author>lfYexun</author><pubDate>Mon, 13 Oct 2025 11:35:51 +0800</pubDate><description><![CDATA[本文介绍了在Vue项目中集成Markdown解析器marked的3个步骤：1)通过npm安装marked依赖；2)在vue.config.js中配置transpileDependencies；3)在组件中引入marked并调用parse方法将Markdown文本转换为HTML。该方法简单高效，适合Vue项目实现Markdown解析功能。]]></description><category></category></item><item><title><![CDATA[前端html导出成pdf并下载]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/153180241</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/153180241</guid><author>lfYexun</author><pubDate>Mon, 13 Oct 2025 09:43:21 +0800</pubDate><description><![CDATA[本文介绍了如何使用html2canvas和jspdf库将HTML内容导出为PDF文件。首先通过npm安装这两个依赖库，然后创建一个exportToPDF工具函数。该函数会计算页面高度、分页渲染Canvas，并将内容转换为JPEG图片格式添加到PDF中，最后保存为指定文件名的PDF文档。在Vue组件中，通过ref获取DOM元素并调用该导出函数实现报告导出功能。整个过程包括分页处理、图片转换和PDF生成，最终生成质量良好的PDF文件。]]></description><category></category></item><item><title><![CDATA[div如何变成可编辑状态]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/153047707</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/153047707</guid><author>lfYexun</author><pubDate>Sat, 11 Oct 2025 14:22:48 +0800</pubDate><description><![CDATA[通过添加contenteditable=&quot;true&quot;属性，可以将&lt;div&gt;元素设置为可编辑区域，允许用户直接在页面上修改内容。示例代码&lt;div contenteditable=&quot;true&quot;&gt;这是一个可编辑的DIV区域&lt;/div&gt;展示了该属性的基本用法。这种特性常用于富文本编辑器等需要用户输入的交互场景。]]></description><category></category></item><item><title><![CDATA[前端js通过a标签直接预览pdf文件，弹出下载页面问题]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/149800382</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/149800382</guid><author>lfYexun</author><pubDate>Thu, 31 Jul 2025 10:55:18 +0800</pubDate><description><![CDATA[摘要：针对Chrome等浏览器默认打开PDF而非下载的问题，文章提出解决方案：通过为下载链接添加response-content-disposition=attachment参数强制触发下载。示例代码展示了如何动态创建隐藏的&lt;a&gt;标签，设置文件路径（含强制下载参数）和文件名，执行点击下载后移除该元素。这种方法适用于GET请求文件下载场景，有效规避浏览器默认预览行为。]]></description><category></category></item><item><title><![CDATA[vue3 antd modal对话框里的前端html导出成pdf并下载]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/149561036</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/149561036</guid><author>lfYexun</author><pubDate>Wed, 23 Jul 2025 09:35:45 +0800</pubDate><description><![CDATA[本文介绍了使用html2canvas和jspdf将HTML内容导出为PDF的实现方法。首先安装依赖包，创建exportToPDF工具函数处理分页渲染和尺寸转换，通过循环截取DOM内容并添加到PDF文档。在Vue组件中通过ref获取目标元素并调用导出方法，同时提示跨域图片需要后端转发或转为base64格式。该方案支持自定义页面边距和像素转换系数，可生成高质量的PDF文档。]]></description><category></category></item><item><title><![CDATA[关于win11右键菜单“正在加载”的可能的解决办法]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/148847489</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/148847489</guid><author>lfYexun</author><pubDate>Mon, 23 Jun 2025 15:27:09 +0800</pubDate><description><![CDATA[AMD显卡驱动升级后右键菜单卡死和弹出驱动窗口的解决方法：通过修改注册表隐藏相关选项。具体步骤为：1）Win+R输入regedit进入注册表；2）定位到HKEY_CLASSES_ROOT\PackagedCom\Package目录；3）将Class\ServerId的0改为1（0显示/1隐藏），AMD相关项则修改AdvancedMicroDevicesInc子项；4）可选择性修改其他显示&quot;正在加载&quot;的项。建议操作前先备份注册表，修改后右键菜单即可恢复正常。]]></description><category></category></item><item><title><![CDATA[原生SSE实现AI智能问答+Vue3前端打字机流效果]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/147095806</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/147095806</guid><author>lfYexun</author><pubDate>Wed, 09 Apr 2025 16:41:05 +0800</pubDate><description><![CDATA[3.在SSE的onmessage里监听返回的数据流，并拼接到前端对话框中，我这里接的是deepseek，所以返回的数据流里会有推理信息，不过后端可以控制不返回推理信息，只返回结果。4.可以加一些细节处理，提升用户体验，比如：保存最近十条的聊天记录（这里存到了localStorage里），允许用户主动停止正在生成的内容，每次读取流时页面需要滚动到底部等。2.用户输入问题，点击提问按钮，创建一个SSE实例请求后端数据，由于SSE是单向流，所以每提一个问题都需要先把之前的实例关掉，然后重新new个SSE实例。]]></description><category></category></item><item><title><![CDATA[vue3自定义动态锚点列表，实现本页面锚点跳转效果]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/146565654</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/146565654</guid><author>lfYexun</author><pubDate>Thu, 27 Mar 2025 17:10:00 +0800</pubDate><description><![CDATA[需求：当前页面存在多个模块且内容很长时，需要提供一个锚点列表，可以快速查看对应模块内容。1.每个模块添加唯一id，添加锚点列表div。2.初始化锚点列表，监听滚动事件。]]></description><category></category></item><item><title><![CDATA[vue3子组件手动吸顶]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/146478168</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/146478168</guid><author>lfYexun</author><pubDate>Mon, 24 Mar 2025 15:53:31 +0800</pubDate><description><![CDATA[【代码】vue3子组件手动吸顶。]]></description><category></category></item><item><title><![CDATA[解决antd3.xAutoComplete组件在页面滚动时面板内下拉列表未跟随滚动的问题（实测有效）]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/146232464</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/146232464</guid><author>lfYexun</author><pubDate>Thu, 13 Mar 2025 15:37:58 +0800</pubDate><description><![CDATA[getPopupContainer属性在对应的AutoComplete文档中未直接体现，但确实可以用。]]></description><category></category></item><item><title><![CDATA[js 根据color两个端点颜色，生成渐变色区间]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/144738091</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/144738091</guid><author>lfYexun</author><pubDate>Thu, 26 Dec 2024 11:18:51 +0800</pubDate><description><![CDATA[在JavaScript中，生成两个颜色之间的渐变色区间，它接受两个颜色值（可以是十六进制、RGB或RGBA格式）和一个步长（即渐变色的数量），然后返回一个包含渐变色的数组。这个方法适用在在绘制地图渐变等操作，比如根据颜色展示地图不同省份的热度，重点是不需要你设置每一个颜色的色值，只要设置初始和结束的颜色即可。// 生成10个渐变色。]]></description><category></category></item><item><title><![CDATA[es6 字符串每隔几个中间插入一个逗号]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/144737601</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/144737601</guid><author>lfYexun</author><pubDate>Thu, 26 Dec 2024 11:03:50 +0800</pubDate><description><![CDATA[输出: 123,456,789,0。// 每隔3个字符插入逗号。]]></description><category></category></item><item><title><![CDATA[cocoscreater3.8.4生成图集并使用]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/144003301</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/144003301</guid><author>lfYexun</author><pubDate>Sun, 24 Nov 2024 09:37:14 +0800</pubDate><description><![CDATA[2.将图片拖动进来，即可自动生成精灵表，这里输出选用cocos2d-x，打包用免费版的“基本”就行，高级模式是收费的，然后点击“发布精灵表”，4.将plist和png一起放到resources目录下，注意两者要放在一起，然后用resources.load加载即可。5.控制台里打印的就是图集里各个精灵图的spriteFrame，然后根据自己需求使用即可。3.会导出两个文件，一个plist配置文件，一个png图集文件。1.安装texturepacker，去官网下载。]]></description><category></category></item><item><title><![CDATA[cocoscreater3.8.4 调用微信api]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/143860820</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/143860820</guid><author>lfYexun</author><pubDate>Mon, 18 Nov 2024 16:46:01 +0800</pubDate><description><![CDATA[注：在cocoscreater中预览是看不到效果的，需要打包成微信小游戏，然后用微信开发者工具运行才能看到效果。2.然后在ts文件中使用wx变量就不报红线了，建议trycatch包裹下，否则可能会在控制台上报错。1.在项目目录下（与assets目录同级）安装miniprogram-api-typings。]]></description><category></category></item><item><title><![CDATA[g6图表监听图表容器的父元素尺寸变化]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/143604211</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/143604211</guid><author>lfYexun</author><pubDate>Thu, 07 Nov 2024 18:10:51 +0800</pubDate><description><![CDATA[通过new ResizeObserver方法可以监听到父元素尺寸变化，resize能监听到手动拖曳导致的浏览器窗口变化，可以都加上。]]></description><category></category></item><item><title><![CDATA[npm i忽略依赖冲突]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/143603997</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/143603997</guid><author>lfYexun</author><pubDate>Thu, 07 Nov 2024 18:05:21 +0800</pubDate><description><![CDATA[2.使用--legacy-peer-deps参数：这个参数用于处理peer依赖冲突。在某些情况下，npm会因为peer依赖版本不匹配而报错，使用这个参数可以忽略这些错误。1.使用--force或-f参数：这个参数会强制npm忽略某些错误，包括依赖冲突，但并不推荐这样做，因为它可能会导致依赖问题，使得项目不稳定。在使用npm安装依赖时，如果遇到依赖冲突，通常npm会提示错误并阻止安装。]]></description><category></category></item><item><title><![CDATA[记录cocoscreater3.8.x设置2d卡牌圆角]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/142678252</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/142678252</guid><author>lfYexun</author><pubDate>Wed, 02 Oct 2024 09:14:45 +0800</pubDate><description><![CDATA[引擎版本：Cocos Creater3.8.3版本。2.在Card节点上绑定CardController.ts脚本。在CardController.ts编写圆角脚本，其实就是动态绘制Graphics组件。1.在Card节点上添加Mask组件，类型选择。]]></description><category></category></item><item><title><![CDATA[小程序获取自定义tabbar高度踩坑]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/141749911</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/141749911</guid><author>lfYexun</author><pubDate>Sat, 31 Aug 2024 11:15:50 +0800</pubDate><description><![CDATA[在小程序中使用自定义tabbar后，页面page高度会包含自定义tabbar高度，为了方便页面布局，可以获取tabbar高度后，用calc(100% - {{tabbarHeight}})来计算。3.custom-tab-bar/index.ts，定义获取高度方法。]]></description><category></category></item><item><title><![CDATA[小程序自定义tabbar]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/141255194</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/141255194</guid><author>lfYexun</author><pubDate>Fri, 16 Aug 2024 11:37:52 +0800</pubDate><description><![CDATA[1.修改app.json，在json中加入如下代码，注意这里的样式和list并不会用到，但是需要存在，而下面的usingComponents里引入的custom-tab-bar则是自定义的tabbar。2.在components目录下自定义custom-tab-bar，文件夹名称必须叫这个custom-tab-bar，这里我用的tdesign组件。3.在需要的页面里引入custom-tab-bar组件，注意每个页面都需要引入。我的：pages/my/my.wxml。]]></description><category></category></item><item><title><![CDATA[世界地图名称中文映射表]]></title><link>https://blog.youkuaiyun.com/lfYexun/article/details/141156414</link><guid>https://blog.youkuaiyun.com/lfYexun/article/details/141156414</guid><author>lfYexun</author><pubDate>Tue, 13 Aug 2024 10:07:15 +0800</pubDate><description><![CDATA[工作需要自己重新整理了一份，里面的code不一定完全匹配，用的话可以自己增减修改。]]></description><category></category></item></channel></rss>