记录---在Vue项目中启用HTTPS本地开发
写在开头 点赞 + 收藏 学会 现代前端开发中，启用HTTPS本地环境越来越重要。本文将详细介绍如何在Vue项目中配置HTTPS开发服务器，使用mkcert工具生成可信证书，解决跨域问题并模拟真实生产环境。 为什么需要HTTPS本地开发？ 使用浏览器新特性（如地理位置API） ...
vxe-upload vue 实现附件上传、手动批量上传附件的方式
vxe-upload vue 实现附件上传、手动批量上传附件的方式 查看官网：https://vxeui.com gitbub：https://github.com/x-extends/vxe-pc-ui gitee：https://gitee.com/x-extends/vxe-pc-ui 安装 ...
记录---grid实现瀑布流
写在开头 点赞 + 收藏 学会 效果图 瀑布流布局原理 瀑布流布局（Waterfall Layout）是一种等宽不等高的多列布局方式，视觉上元素像瀑布一样逐列填充。核心原理： 等宽多列：将容器划分为多个等宽的列。 动态填充：元素按顺序优先插入当前高度最短的列，保证布局紧凑。 ...
Web前端入门第 75 问：JavaScript 性能优化之事件委托（事件代理）原理
如今 Vue 大行其道，大部分开发场景直接使用 @click 就实现了事件绑定，可能都没思索过 JS 中的事件性能优化。 事件委托原理 事件委托 其主要是利用了事件冒泡这个特性。 以点击事件 click 为例：将事件绑定在父元素上，点击子元素会通过冒泡的方式触发父元素的点击事件。这种绑定事件的方式， ...
Cesium 无人机巡检三维效果实现
uavInspection.js代码 /** * 无人机巡检 */ import * as mars3d from "mars3d" import * as Cesium from 'mars3d-cesium' import * as turf from "@turf/turf" import { ...
企业级数据网格方案AG Grid Enterprise 34 发布：聚焦过滤、编辑与树数据管理的全面升级
AG Grid成立于英国，致力于提供优秀的企业级数据表格及图表解决方案。 AG Grid及AG Charts是其两大主要的高性能企业级JavaScript数据表格及图表解决方案，被全球开发者广泛采用。凭借其卓越的性能、丰富的功能与高度可定制性，成为构建复杂数据驱动型应用的优选工具库。 近日，AG G ...
记录---CSS Grid 布局：现代网页布局的强大工具
写在开头 点赞 + 收藏 学会 CSS Grid 布局（网格布局）是 CSS 中一种强大的二维布局系统，它彻底改变了我们构建网页布局的方式。与传统的布局方法（如浮动、定位或 Flexbox）相比，Grid 提供了更直观、更灵活的方式来创建复杂的网页布局。 一、Grid 布局的 ...
vue3预览pdf可旋转并拖拽盖章任意位置生成新文件
对pdf旋转、拖拽公章或其他图片到pdf任意位置，生成一个新的pdf进行下载 网上搜了一下代码量都挺大的，这里自己来实现一个吧！ 涉及到的技术栈：pdfjs-dist、pdf-lib、vueuse <script setup> import { ref, onMounted, computed } ...
vue vxe-table 自适应列宽，根据内容自适应宽度的2种使用方式
vue vxe-table 自适应列宽，根据内容自适应宽度的2种使用方式 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee.com/x-extends/vxe-tabl ...
Web前端入门第 74 问：JavaScript 事件冒泡与事件捕获
在讨论冒泡和捕获之前，先看这么一段代码： <style> .bd { border: 1px solid #000; padding: 8px; } </style> <div id="container1" class="bd"> 外层 <div id="container2" class="bd ...
javascript中IIFE（立即执行函数表达式）到底是咋来的？
介绍 IIFE(Immediately Invoked Function Expression)，中文名称：立即执行函数表达式，其实IIFE最早并不叫这个名字，而是叫做Self-Executing Anonymous Function，即自执行匿名函数。根据MDN的资料，IIFE这个说法最早由Ben ...
Web前端入门第 73 问：JavaScript DOM 常用事件那点小事
网页上各种炫酷的交互效果离不开各种 DOM 事件 的支持，在写这篇文章之前，一度以为 JS 的事件绑定/取消方式就我知道的那几种，翻阅文档之后才发现，知识面还是有待提升，多翻翻文档，就像发现新大陆一样~~ 常用事件 鼠标事件： click：鼠标左键单击 dblclick：鼠标左键双击 mousedo ...
Web前端入门第 72 问：JavaScript DOM 内容操作常用方法和 XSS 注入攻击
当项目的安全团队找上门告诉您，您开发的项目存在 XSS 安全漏洞，作为一个开发人员，就问您慌不慌？？ HTML 内容写入的时候，如果稍不注意就会触发隐藏 BOSS 漏洞 XSS。 XSS 漏洞原理就是利用了网站上内容输入的地方，比如说常见的评论提交，老六 通过输入评论的地方，提交一些 包含 JS 代 ...
如何使用 vue vxe-table 来实现一个产品对比表表格
如何使用 vue vxe-table 来实现一个产品对比表表格 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee.com/x-extends/vxe-table 效果 ...
Web前端入门第 71 问：JavaScript DOM 节点操作（增删改）常用方法
有一个深有体会的事：发现现在很多前端同学，经常用 Vue 开发项目之后，在某些需求场景要操作 DOM 节点的时，就不知道咋办了~~ 以前接手过其他开发团队的项目，项目被漏洞扫描工具发现了异常，原因是用了一个 vue-video-player 插件用于播放视频，这插件又依赖了低版本的 video.js ...
vxe-table vue 表格禁用单元格编辑的2种实现方式
vxe-table vue 表格禁用单元格编辑的2种实现方式 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee.com/x-extends/vxe-table 阻止激活 ...
Web前端入门第 70 问：JavaScript DOM 节点查找常用方法
虽然目前的开发场景基本都是使用 React/Vue/Angular 等框架，但是对于一些基础的 DOM 操作，还是需要了解学习。 曾经我们讨论过这样一个问题：Vue 这些开发框架，用它们渲染页面，真的就比不用开发框架快吗？ 其实这个问题很好回答的，开发框架只是优化了项目的开发效率，对于浏览器的渲染速 ...
Web前端入门第 69 问：JavaScript Promise 提供的方法都使用过吗？
Promise 这个 API 曾在 JS 领域掀起过血雨腥风，以前的大佬们都喜欢手搓一个自己的 Promise 用以理解 Promise 的原理。 Promise 的诞生，应该多少都有受到 jQuery 的异步方法 $.Deferred() 影响。 应用场景 Promise 唯一作用就是在处理异步耗 ...
1.新建pnpm+monorepo架构项目
一、前期准备： 1. 准备node环境（推荐nvm方式管理node版本）； 2.安装pnpm(pnpm 通过创新存储模型解决了 npm/yarn 的磁盘冗余、依赖污染等核心痛点，尤其适合 Monorepo 项目、低存储环境及高稳定性要求的场景。若项目无特殊兼容需求，pnpm 是当前最优解。)； ...
使用 vue vxe-table 实现复选框禁用，根据行规则来禁用是否允许被勾选选中
使用 vue vxe-table 实现复选框禁用，根据行规则来禁用是否允许被勾选选中 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee.com/x-extends/vx ...
