记录---写个vite插件自动处理系统权限，降低99%重复工作
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
前言
好久没有更文章咯，最近做一个中台系统的权限控制功能，由于路由权限和角色权限都简单，但是要做按钮权限有点麻烦，因为太多按钮了。其实我以前也做过这个功能，简单暴力做法就是每个按钮用自定义指令去判断是否有权限显示。但是重复代码也太多太多，并且维护性极差， ...
前端表格控件选型指南：Jspreadsheet、AG Grid、SpreadJS，谁更适合你？
在ERP、MES、数据分析、财务报表等数字化应用场景中，表格控件是前端界面中不可或缺的组件。从类Excel交互，到大数据渲染、再到复杂报表展示，不同项目对表格的需求千差万别。
今天这篇文章，将为你详细解析三款国际知名的商业级前端表格解决方案：✅ Jspreadsheet✅ AG Grid✅ SpreadJS
它们各自擅长什么？ ...
记录---用 iframe 实现前端批量下载的优雅方案 —— 从原理到实战
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
传统的下载方式如window.open()或<a>标签点击存在诸多痛点：
批量下载时浏览器会疯狂弹窗
HTTPS页面下载HTTP资源被拦截
今天分享的前端iframe批量下载方案，可以有效解决以上问题。
一、传统批量下载方案的局限性
传统的批量下载方式通常是循环创建 a 标签并触发 ...
vue vxe-tree 树组件加载大量节点数据，虚拟滚动的用法
vue vxe-tree 树组件加载大量节点数据，虚拟滚动的用法
查看官网：https://vxeui.com
gitbub：https://github.com/x-extends/vxe-pc-ui
gitee：https://gitee.com/x-extends/vxe-pc-ui
上万节点数据
当数据量达到上万时，通过数据双向绑定将会影响性能，可以通过调用 loadData 来加载数据
<template>
<div>
<vxe-but ...
Stimulsoft 仪表板支持 OpenStreetMap：适应必应地图 API 停用新变化
近日，Stimulsoft 官方宣布其产品在“在线地图”功能方面进行了关键调整。自 2025.3.1 版本起，Stimulsoft Dashboards 新增支持 OpenStreetMap，用户在创建仪表板地图时可灵活选择地图服务提供商。
Stimulsoft Ultimate （原Stimulsoft Reports.Ultimate）是用于创建报表和仪表板的通用工具集。该产品包括用于Win ...
数组去重的几种姿势
上篇文章说到了引导式访问组件，其中有个扩展功能是是否强制以及是否第一次进行引导访问，这时候有个 guideKey 可以作为根据判断，那么存储拿取的时候就用到唯一值了，然后就有了这篇文章介绍的几种姿势，有深入哦~
背景
假设已经使用 guideKeyList 来记录已完成的引导步骤：
let guideKeyList = uni.getStorageSync("guid ...
Web前端入门第 77 问：JavaScript 由程序触发绑定事件的几种方式
开发中经常会遇这样的需求：点击 A 元素的时候，需要触发 B 元素的事件，比如：点击一个 div 元素，然后触发 input:file 的 click 事件，用来选择文件上传。
click 方法
以上需求可通过元素的 click 方法触发：
<style>
.test2 {
padding: 4px;
margin-top: 12px;
}
</style>
<input type="file" class="test1" ...
vxe-tree vue 树组件实现关键字搜索
vxe-tree vue 树组件实现关键字搜索
查看官网：https://vxeui.com
gitbub：https://github.com/x-extends/vxe-pc-ui
gitee：https://gitee.com/x-extends/vxe-pc-ui
代码
实现方式通过输入框输入内容，对数据进行筛选过滤
<template>
<div>
<div>
<vxe-input v-model="filterName" type="search" clearable @c ...
JavaScript
数据类型
基础类型: String、Number、Boolean、null、undefined、Symbol 存储在栈中，赋值变量和比较均为数据本身。
引用类型：Object、Array、Map、Function 存储在堆中，使用new创建，赋值变量和比较均是内存地址。
检测数据类型
1.typeof 基本数据类型
不能区分null，数组，对象，正则，因为返回的都是”object”
type ...
Web前端入门第 76 问：JavaScript 鼠标事件(mouse) enter/leave 和 over/out 区别
题外话
在考察事件基础的时候，会经常被问及 click、mousedown、mouseup 它们三者执行的先后顺序是怎样的？
如果平时没太注意，这细节可能就会忽略，毕竟很少会在同一个元素上面同时绑定这三个事件~~
直接上示例：
<div class="c">测试点击事件</div>
<script>
(() => {
const c = document.querySelector('.c')
...
企业级图表方案AG Charts v12正式发布：全新功能提升图表交互体验与开发效率
AG Grid成立于英国，致力于提供优秀的企业级数据表格及图表解决方案。
AG Grid及AG Charts是其两大主要的高性能企业级JavaScript数据表格及图表解决方案，被全球开发者广泛采用。广泛应用于金融、电信、制造等行业，支持 Angular、React、Vue 和纯 JavaScript 项目，拥有企业级的性能与功能深度，凭借其卓越的性能、丰富的 ...
记录---在Vue项目中启用HTTPS本地开发
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
现代前端开发中，启用HTTPS本地环境越来越重要。本文将详细介绍如何在Vue项目中配置HTTPS开发服务器，使用mkcert工具生成可信证书，解决跨域问题并模拟真实生产环境。
为什么需要HTTPS本地开发？
使用浏览器新特性（如地理位置API）
解决第三方登录（OAuth）的loca ...
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
安装
npm install vxe-pc-ui@4.6.47
// ...
import VxeUIAll from 'vxe-pc-ui'
import 'vxe-pc-ui/lib/style.css'
// ...
createApp(Ap ...
记录---grid实现瀑布流
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
效果图
瀑布流布局原理
瀑布流布局（Waterfall Layout）是一种等宽不等高的多列布局方式，视觉上元素像瀑布一样逐列填充。核心原理：
等宽多列：将容器划分为多个等宽的列。
动态填充：元素按顺序优先插入当前高度最短的列，保证布局紧凑。
基于 CSS Grid 的实现思路
CSS ...
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 { getMap } from '@/components/mars3dMap/js/index.js'
import { getHeightByLngLat } from '@/components/mars3dMap/js/utils.js'
import GlowLineM ...
企业级数据网格方案AG Grid Enterprise 34 发布：聚焦过滤、编辑与树数据管理的全面升级
AG Grid成立于英国，致力于提供优秀的企业级数据表格及图表解决方案。
AG Grid及AG Charts是其两大主要的高性能企业级JavaScript数据表格及图表解决方案，被全球开发者广泛采用。凭借其卓越的性能、丰富的功能与高度可定制性，成为构建复杂数据驱动型应用的优选工具库。
近日，AG Grid Enterprise 34 正式发布，作为 2025 ...
记录---CSS Grid 布局：现代网页布局的强大工具
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
CSS Grid 布局（网格布局）是 CSS 中一种强大的二维布局系统，它彻底改变了我们构建网页布局的方式。与传统的布局方法（如浮动、定位或 Flexbox）相比，Grid 提供了更直观、更灵活的方式来创建复杂的网页布局。
一、Grid 布局的基本概念
1. 什么是 Grid 布局？
CSS G ...
vue3预览pdf可旋转并拖拽盖章任意位置生成新文件
对pdf旋转、拖拽公章或其他图片到pdf任意位置，生成一个新的pdf进行下载
网上搜了一下代码量都挺大的，这里自己来实现一个吧！
涉及到的技术栈：pdfjs-dist、pdf-lib、vueuse
<script setup>
import { ref, onMounted, computed } from 'vue';
import * as pdfjsLib from 'pdfjs-dist/build/pdf';
import { useDraggable } ...
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-table
第一种，整列根据内容自适应宽度
整列根据内容自适应宽度，包括表头、表体、表尾同时自定义宽度，适用需要完整显示的场景
<temp ...
