老板:能不能别手动复制路由了?我:写个脚本自动扫描
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
起因
周五快下班,老板过来看权限配置页面。
"这个每次都要手动输路径?"
"对,现在是这样。"我打开给他看:
角色:运营专员
路由路径:[手动输入] /user/list
组件路径:[手动输入] @/views/user/List.vue
"上次运营配错了,/user/list 写成 /user/lists,页面打不开找了 ...
vue3这些常见指令你封装了吗
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
vue3这些常见指令你封装了吗
👉指令搭建
vue3之中会有一些常见的指令操作,接下来我们就写一下,之前我们写了权限按钮,其实是类似的
指令的最主要文件如下,我们主要是主模块之中使用,其他的模块之中分割写好方法即可
指令主要文件
src%utils\directive\index.ts
import typ ...
React 技术深度探讨
聊React之前,先说个事实:它不是最年轻的框架,也不是概念最创新的那个。但它赢了。
赢在生态,赢在社区,赢在"一旦用顺了就很难换"的惯性。本文不吹不黑,客观聊聊React的核心逻辑、实际现状,以及值不值得继续押注。
一、核心概念:理解React的设计哲学
Virtual DOM:快是表象,稳才是本质
Virtual DOM(虚拟DOM)被谈烂 ...
前端大屏适配方案:rem、vw/vh、scale 到底选哪个?
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
上周帮朋友救火一个数据大屏项目,甲方临时说要从 1920×1080 的投影换成 3840×1080 的超宽拼接屏。朋友用的是 transform: scale 方案,结果两边各留了一大片黑边,甲方当场黑脸。
这事儿让我决定把大屏适配这个"老生常谈但总有人踩坑"的话题彻底讲清楚。
先说结论
我的推 ...
前端实现进度条
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
后端处理数据处理逻辑特别多的时候,并不会很及时返回数据,一般情况后端给前端返回进度,这个目前是前端自己返回进度到90,等到接口返回完成再到100%
1、设置全局样式
<div class="loading-overlay" v-show="PageController.nextLoading">
<div class="loading-con ...
跨全平台!一款免费开源的电子书阅读器!
大家好,我是 Java陈序员。
在数字阅读成为常态的今天,我们却总被各种阅读痛点困扰:格式不兼容、跨设备同步难、外文书籍翻译繁琐、技术文档代码显示混乱……这些细碎的问题,一点点消磨着深度阅读的乐趣。
今天,给大家介绍一款开源免费的电子书阅读器,支持多平台使用!
关注微信公众号:【Java陈序员】,获取开源项目 ...
uni-app使用瓦片实现离线地图的两种方案
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
最近接到一个安卓App的活儿,虽然功能上不算复杂,但因为原本没怎么做过安卓端,所以也是"摸着石头过河"。简单写一下踩过的坑和淌的水吧~
uni-app实现离线地图主要用 leafletjs 实现,但是因为在安卓端运行,存在渲染问题,所以还要用上 renderjs。
实现方案一:web-view
因 ...
为什么全国人民都能秒开同一个视频?
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
为什么你在北京打开一个视频,加载只要1秒?你的朋友在新疆,打开同一个视频,也是1秒?服务器难道全国各地都放了?
今天,用**"快递"**的故事,来讲讲CDN的原理。
没有CDN时,网络请求是怎么跑的?
你在北京,想从上海寄一箱苹果。
没有CDN的情况下:
你(北京)→ 上海工 ...
Vue 表格组件 vxe-table 灵活导出指定数据的 CSV 文件的用法
在实际业务开发中,表格数据导出是高频需求。大多数场景下,我们导出的是表格当前展示的数据,但有时业务需要导出特定的数据集(如:筛选后的结果、选中的数据、或后端返回的原始数据)。本文将基于 vxe-table 组件,介绍如何通过 exportData 方法实现指定数据导出,并提供多种实用场景的解决方案。
exportData 方法说明
vx ...
Vue 甘特图组件 vxe-gantt 如何精准定位到行、列与任务视图
Vue 甘特图组件 vxe-gantt 如何精准定位到行、列与任务视图
在项目管理系统中,甘特图是展示任务时间线的重要工具。当项目数据量庞大时,手动滚动查找特定任务或日期列会非常低效。vxe-gantt 组件提供了 scrollToRow、scrollToColumn 和 scrollToTaskView 等 API,允许我们通过代码控制视图滚动,将目标行、列或任务条精确 ...
0.1加0.2为什么不等于0.3
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
0.1 + 0.2 为什么不等于 0.3?答不上来的都挂了
这个问题你可能在面试、线上 Bug、甚至随手写 Demo 的时候都见过:
console.log(0.1 + 0.2 === 0.3); // false
很多人第一反应是“浮点数精度问题”,但如果继续追问:
为什么偏偏是 0.1、0.2 这种小数出问题?
“精度”到 ...
效率工具推荐!一款开源免费的代办管理工具!
大家好,我是 Java陈序员。
在快节奏的工作与生活里,每天被大大小小的任务包围,被零散的待办事项打乱节奏,也被层出不穷的代办管理工具弄得眼花缭乱。市面上的代办工具要么复杂难上手,要么充斥广告和付费陷阱。
今天,给大家介绍一款开源免费的代办管理工具,支持多平台使用!
关注微信公众号:【Java陈序员】,获取开 ...
Vue3 + Vite项目实战:从零搭建企业级前端架构
前言
Vue3已经正式发布,成为前端开发的主流框架。结合Vite构建工具,开发体验大幅提升。本文从零搭建一个企业级Vue3项目,包含路由、状态管理、API封装、权限控制等核心模块。
一、环境准备
# Node.js >= 16
node -v
# 创建项目
npm create vite@latest my-vue3-app -- --template vue
cd my-vue3-app
npm install
npm r ...
前端发版后页面白屏?一套解决用户停留旧页面问题的完整方案
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
场景
在单页面应用(SPA)项目中,有一个问题非常常见,但又经常被低估:系统明明已经发布了新版本,部分用户却依然停留在旧页面中继续操作。
大多数时候,这种状态并不会立刻出问题,所以团队往往不太在意。但一旦用户继续进行路由跳转、访问懒加载页面,或者触发某些依赖新 ...
vue甘特图vxe-gantt实现点击任务条弹出编辑表单
基于 vxe-gantt 实现任务条点击编辑表单
在项目管理中,甘特图是展示任务进度的核心组件。本文将介绍如何使用 vxe-gantt 组件实现点击任务条弹出编辑表单的功能,支持对任务的名称、时间、进度、负责人、图片附件等信息进行编辑。
效果
点击甘特图中的任意任务条,系统会弹出模态框,展示当前任务的详细表单,编辑保存后甘 ...
关于地图渲染加20w数据展示和地图动画怎么做
🧑💻 写在开头
点赞 + 收藏 === 学会🤣🤣🤣
前端性能优化实战:ECharts地图渲染12万+数据动态动画方案
本文记录了在实际项目中,使用ECharts地图组件渲染12万+设备安装数据的性能优化实战经验,包含完整的技术方案和代码实现。
项目背景
公司需要将全年设备安装量通过旗帜的形式展示在全国地图上,实现数据可视化大屏 ...
打字学英语!一款开源单词与文章练习工具!
大家好,我是 Java陈序员。
对于英语学习,很多人都卡在“背单词”这一关:背了忘、忘了背,明明花了大量时间,效果却微乎其微。
其实问题不在于努力,而在于方法 —— 传统的“看 + 读”属于被动输入,记忆留存率极低。
今天,给大家介绍一款开源英语单词与文章练习工具,通过“打字”完成单词/文章的学习,用主动输入替代 ...
三、前端开发场景实战:从需求到可交付页面
三、前端开发场景实战:从需求到可交付页面
前端为什么特别需要 AGENTS.md
因为前端的“错”,很多时候不是功能错,而是风格、结构、状态、交互细节错。
这些问题放到代码层面不一定报错,但上线后很容易被一眼看出来:
组件明明仓库里已经有了,AI 又新写了一套。
页面主流程看着能跑,但 loading、empty、error 三态没做 ...
vue甘特图vxe-gantt自定义任务视图单元格的背景颜色
通过 taskViewConfig.viewStyle.cellStyle 可以直接为甘特图日期轴上的每一个单元格设置内联样式,实现灵活的背景色、边框、字体等视觉效果。
配置说明
样式配置位于 taskViewConfig.viewStyle.cellStyle,它是一个函数,接收当前单元格对应的日期对象,返回一个样式对象
taskViewConfig: {
viewStyle: {
cellStyle({ ...
vue甘特图vxe-gantt如何设置日期轴显示为周模式
通过 taskViewConfig.scales 参数,可以灵活配置甘特图日期轴的显示层级。本文将介绍如何将日期轴显示为“月 + 周”模式,以及如何自定义每周的起始日期。
核心配置示例
要显示“月 + 第几周”的双层日期轴,只需在 scales 数组中同时配置 'month' 和 'week' 即可。
<template>
<div>
<vxe-gantt v-bind="ganttOptio ...