随笔分类 - 前端
前段相关知识
摘要：事情起因：当我点击列边框准备拖动的时候，发现它会嗖一下先变成50px 下方内容是Qoder解决了我的问题后，让他写的文档 Vue 2 项目中 vue-draggable-resizable 列宽拖动问题修复 技术背景 技术栈 框架：Vue 2.7 UI 组件库：Ant Design Vue 1.7.
阅读全文
摘要：原来： 修改后： 代码如下： <style scope> /* 表格筛选器按钮样式 */ :deep(.ant-table-filter-dropdown-btns) { display: flex; flex-direction: row-reverse; justify-content: fle
阅读全文
摘要：在企业级前端应用中，表格数据的高效转换对性能至关重要。本文以一个核算系统为例，剖析了原始实现中因三层嵌套循环和线性查找导致的 O(T×P×S) 时间复杂度瓶颈。通过引入预处理阶段，构建“项目ID → 科目编码 → 值”的哈希映射表，将内层查找优化至 O(1)，整体复杂度降至 O(P×S + T×P)。实测在百级项目、千级科目场景下，性能提升近 30 倍，页面渲染从卡顿变为流畅。该优化无需复杂算法，仅依靠基础的数据结构思维，即可显著提升用户体验，体现了前端工程师必备的性能意识与工程素养。
阅读全文
摘要：应用场景 场景1：我们再给其他企业做开发的时候（子系统，或者某个板块的开发），不走登录页面的，但是访问里面的页面需要授权，因此可以使用这款插件自动给请求插入请求头，方便前后端联调测试。 当然有时候子系统需要依赖企业客户内网的中的一个项目（比如获取组织信息），但是我们没权限去使用那个项目，就可以使用这
阅读全文
摘要：如图，设置 position: absolute; bottom: 0; width: 100%; padding: 16px 0; background: #fff; text-align: right; z-index: 1; (父容器设置) position: relative;
阅读全文
摘要：如上图，堆叠的时候，柱子上方显示堆叠的总数。那不堆叠的时候，如下图，就显示自己的数据 那么怎么实现这个功能呢（完整组件代码在文末） 首先要解决的问题1： 你怎么知道用户通过图例（legend）点击事件来切换系列的可见性？ initChart() { this.chartInstance = echa
阅读全文
摘要：由于antv x1版本日期选择器不能直接只选择年份，官方建议是自己封装，那成。 <!-- 年份选择组件 --> <template> <a-date-picker :value="currentValue" mode="year" format="YYYY" :open="isOpen" @pane
阅读全文
摘要：【企业级项目实操指南1】结合已有代码和MPJ实现统一的数据统计接口（1） https://www.cnblogs.com/zwj/p/18829115/bnp-doit-001 在（1）的基础上做一些优化和补充，一方面是满足日期范围搜索条件，一方面是对命名的优化。 后端 - MPJAggregate
阅读全文
摘要：效果 代码 这是vue2版本 <template> <div class="progress-container"> <!-- 进度条 --> <a-progress :percent="computedPercent" :stroke-color="getProgressColor(compute
阅读全文
摘要：[声明]企业级项目实操指南系列笔记是萌狼蓝天再企业中完成开发任务后做的记录，出于保密需求，部分代码将不会展示，因此仅供参考。 业务需求 ERP系统需要为每个页面都增加统计功能。统计字段、统计方式（sum、avg、count等）由前端指定，同时，统计范围和页面搜索结果的范围有关。 不能前端统计，由于数
阅读全文
摘要：请先查阅： [CI]Docker构建时传递CI的唯一生成号作为版本号（SpringBoot、Vue） https://blog.csdn.net/ks2686/article/details/147066204 如果你不想看CSDN话也可以看，我在博客园发的是前后端分开的两篇，同步CSDN的时候整合
阅读全文
摘要：
【温馨提示】 阅读完本文后 不要着急行动 可以继续阅读一下 [CI]Vue+SpringBoot项目显示CI构建号(补充) https://www.cnblogs.com/zwj/p/18826834 平台：Azure DevOps 部署方式：docker 后端方案：https://www.cnbl
阅读全文
【温馨提示】 阅读完本文后 不要着急行动 可以继续阅读一下 [CI]Vue+SpringBoot项目显示CI构建号(补充) https://www.cnblogs.com/zwj/p/18826834 平台：Azure DevOps 部署方式：docker 后端方案：https://www.cnbl
阅读全文
摘要：<!-- 滚动条开始 --> <div class="custom-scrollbar-container"> <!-- 添加左右箭头按钮 --> <div class="scroll-arrow left-arrow" @click="scrollBy(-100)"> <i class="icon
阅读全文
摘要：Iconfont图标获取和引用 后文介绍了三种图标获取和引用的方式，如果网站用得是iconfont网站（阿里巴巴矢量图标库）的图标，则下面方法适用。 unicode图标获取和引用 1 获取 对于引用iconfont网站（阿里巴巴矢量图标库）图标的网站，通过浏览器查审元素功能，在源码<head>部分，
阅读全文
摘要：很多时候客户是不懂技术的，而你需要给他的只是一个“网页” 所以，用vue做好网页后，打包给客户，最好是双击打开就能用，不需要做其他事 vite.config.js: import { defineConfig } from 'vite' import vue from '@vitejs/plugin
阅读全文
摘要：情景说明 基本上，Vue里面写Style，都是<style scoped> 很多时候，需要我们对使用的UI组件做一些调整 你可以会这样做：在网页查审元素，定位要修改组件，找到它的样式名称 你就在<style scoped>里面添加它的CSS样式，发现没有效果 问题分析 1 Vue是如何防止CSS污染
阅读全文
摘要：为了美观，菜单不能出现滚动条，但是菜单太长的时候，能进行滚定动。 容器设置 overflow: 'auto' 再为容器添加如下样式 .hide-scrollbar::-webkit-scrollbar { display: none; /* Chrome/Safari/Edge */ } .hide
阅读全文
摘要：https://www.antdv.com/components/date-picker-cn https://www.antdv.com/components/config-provider-cn/ https://www.antdv.com/docs/vue/i18n-cn <script se
阅读全文
摘要：情况1：在布局中设置 主要是给content添加 overflow-y: auto; <template> <a-layout> <a-layout-header class="layout-header"><header-vue/></a-layout-header> <a-layout> <a-
阅读全文
摘要：安装 npm i vue3-slide-verify --save 引入 import SlideVerify from 'vue3-slide-verify'; import "vue3-slide-verify/dist/style.css"; 使用 <slide-verify @success
阅读全文
浙公网安备 33010602011771号