- 博客(19)
- 收藏
- 关注
RSS订阅原创 关于watchEffect和watch的理解
摘要：Vue中的watch和watchEffect在响应式监听上有明显区别。watch需要显式声明依赖，默认不立即执行，能获取新旧值；watchEffect自动收集依赖，默认立即执行，无法直接获取旧值。在Vue2中使用watchEffect需通过@vue/composition-api兼容库，或使用watch+计算属性模拟其功能。前者更推荐，后者通过计算属性收集依赖并用watch监听实现类似效果。
2025-11-28 11:28:44
257
原创 前端采用xlsx-js-style导出Excel表格
摘要：本文介绍了使用xlsx-js-style库实现前端Excel导出功能的封装方案。文章首先对比了xlsx和xlsx-style的局限性，推荐使用xlsx-js-style解决样式保留问题。核心内容是一个封装好的exportExcel函数，支持多Sheet导出、自定义表头样式、灵活配置列宽等功能。函数接收文件名、Sheet配置等参数，支持对象数组和二维数组两种数据格式，可针对每个Sheet单独设置列宽或采用默认值。该方案解决了样式保留问题，并提供了自动计算列宽、样式设置等实用功能，可作为前端Excel导出
2025-11-12 11:06:19
118
原创 javaScript运行机制
JavaScript事件循环机制中，宏任务（如setTimeout）和微任务（如Promise.then）的执行顺序决定了异步代码的运行结果。关键点：1. 同步代码优先执行；2. 每轮事件循环先执行所有微任务，再执行一个宏任务；3. 每个宏任务执行后都会检查微任务队列。特别注意：Promise构造函数同步执行，而then/catch回调属于微任务。理解这一机制能准确预测异步代码的执行顺序。
2025-08-28 10:18:58
306
原创 FullCalendar使用
本文介绍了如何使用Vue集成FullCalendar日历组件。首先通过npm安装@fullcalendar/vue及相关插件，配置支持月/周/日视图。核心功能包括：1)左侧可拖动任务类型区域，支持添加自定义任务类型和颜色；2)主日历区域支持事件拖拽、点击等交互；3)使用dayjs处理日期格式。代码展示了完整的组件实现，包括模板结构、数据配置（如视图类型、语言、事件样式等）和主要方法（添加任务类型、处理拖拽事件等）。通过Draggable实现外部元素拖入日历的功能，并提供了样式自定义示例。
2025-07-04 14:35:35
314
原创 vue实现文件预览功能
本文介绍了一个基于Vue3的文件预览组件，支持多种常见文件格式的在线展示。组件通过文件扩展名自动识别文件类型，并使用相应方式渲染：Word/Excel文档使用vue-office库，PDF/TXT用iframe嵌入，CSV转为表格展示，图片直接显示。组件接收两种数据源：文件路径或二进制数据，自动转换为可预览的URL。主要特点包括：1) 支持docx/xlsx/csv/txt等办公文档和常见图片格式；2) 二进制数据处理时自动释放内存；3) 响应式设计适应不同尺寸。使用方式简单，只需传入文件路径或二进制数据及
2025-05-27 11:52:57
1067
原创 Element-UI中的el-dialog和自定义指令实现弹出框拖动！！
Element-UI中的el-dialog和自定义指令实现弹出框拖动，废话不多说直接开始。
2025-04-15 10:36:21
681
原创 H5 如何解决移动端适配问题
通过使⽤ flexible 布局⽅案，将 px 转化为 rem 单位，并且动态计算根节点的字体⼤⼩，以适配不同的。通过设置 viewport 标签的 meta 属性，来控制⻚⾯的缩放⽐例和宽度，以适配不同的设备。通过将 px 转化为 rem 单位，根据不同的设备字体⼤⼩设置不同的样式，以适配不同的设备。通过 CSS3 的媒体查询，根据不同的设备宽度设置不同的样式，以适配不同的设备。会在⻚⾯加载时动态计算根节点的字体⼤⼩，并将 px 转化为 rem 单位。表⽰将⽹⻚的基准字体⼤⼩设置为 16px，
2024-08-12 17:01:36
710
原创 前端使用jsencrypt 加密
2.可以增加一个工具类文件: 项目名/src/utils/commonUtiljs，内容如下。3.可以通过以下来进行解密（一般前端不做，交给后端，前端可自测是否成功）把这个依赖下载到node modules里面。
2023-11-17 16:18:22
360
1
原创 两步解决vscode中jsx中没有html语法提示问题
第二步 添加项 key 为javascript value 为 Javascriptreact 完成！结束，快去试试吧，一定行！
2023-11-02 21:19:20
645
原创 WebSocket
客户端和服务器可以通过发送和接收这些帧来进行实时的双向通信。它提供了一种实时的、持久化的连接，允许服务器主动向客户端推送数据，而不需要客户端发起请求。相比于传统的HTTP协议，WebSocket具有更低的延迟和更高的效率。总之，使用WebSocket可以实现实时的双向通信，为开发者提供了更高效、更实时的通信方式。在客户端，你可以使用JavaScript的WebSocket API来创建WebSocket连接，并进行数据的发送和接收。在服务器端，你需要使用相应的编程语言和框架来实现WebSocket的逻辑。
2023-08-10 15:50:18
235
1
原创 使用mock造前端假数据
的GET请求，返回一个包含5个对象的数组，每个对象包含id、name、age和gender属性，其中id自增，name是随机的中文名字，age是18到60之间的随机数，gender是男或女。需要注意的是，使用mockjs只能模拟前端的请求，对于后端接口的请求无法拦截并返回模拟数据。如果需要模拟后端接口的数据，可以使用其他工具，如Postman、Swagger等。其实在实际开发的过程中我们是使用后端写好的接口的，但是在一些没有数据的情况下我们可以自己造！文件中，可以使用mockjs提供的语法来编写模拟数据。
2023-06-26 15:34:01
1064
1
原创 关于我对Vuex的爱恨情仇
接下来谈谈我对Vuex的理解，Vuex是Vue.js的官方状态管理库，用于在Vue应用程序中集中管理和共享数据。它为应用程序提供了一个专门的存储容器，称为store，用于存储和管理应用程序的所有状态，并采用了单向数据流的架构模式。总而言之，Vuex是一个强大的状态管理库，通过集中和管理应用程序的状态，简化了Vue.js应用程序中组件之间的数据交互和状态管理。State（状态）：存储应用程序的所有状态数据。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
2023-06-23 14:10:47
107
1
原创 WIN11打不开虚拟机？ 一招教你解决
由于VMware Workstation Pro的版本问题，所以目前有很多的许可证win11系统是不能使用的，会出现打不开虚拟机的情况，不要担心，只要换一个许可证即可。加油好兄弟，希望对你有帮助，奥利给。
2023-02-22 17:22:42
3671
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人