vue 甘特图 vxe-gantt 设置每个进度条分为计划和实际两条，实现上下分布任务条，实现方式是利用子任务的子视图渲染模式，来间每条任务拆分成2条子任务，就可以利用自带的子视图渲染功能来渲染。 https://gantt.vxeui.com 由于放2行超出默认高度，所以还需要通过 cell-co ...

‍ 写在开头 点赞 + 收藏 学会 基于PDF.js的安全PDF预览组件实现：从虚拟滚动到水印渲染 本文将详细介绍如何基于Mozilla PDF.js实现一个功能完善、安全可靠的PDF预览组件，重点讲解虚拟滚动、双模式渲染、水印实现等核心技术。 前言 在Web应用中实现PDF预览 ...

‍ 写在开头 点赞 + 收藏 学会 1. 对齐目标 前端想实现一个类似的书架放置书籍的效果，目标如下： 2. 思路梳理 我们使用的技术栈：vue 实现这样的一个效果，我们需要知道以下信息： 每行可以放置多少书本？ 放下所有的书本需要多少行? 需要什么样的数据结构? 我们现在一个个 ...

‍ 写在开头 点赞 + 收藏 学会 起因 周五快下班，老板过来看权限配置页面。 "这个每次都要手动输路径？" "对，现在是这样。"我打开给他看： 角色：运营专员 路由路径：[手动输入] /user/list 组件路径：[手动输入] @/views/user/List.vue "上 ...

Element UI Table组件基本使用（官方文档） Sortable.js 官方文档 实现步骤 1. 安装SortableJS 通过npm安装： npm install sortablejs --save 或使用国内CDN（推荐）： <script src="https://cdn.jsdel ...

‍ 写在开头 点赞 + 收藏 学会 前言 还记得上周我们团队在招聘前端工程师，一个看起来经验丰富的候选人坐在我对面。 "你们项目中是如何处理按钮重复点击的问题的？"我抛出了这个看似简单的问题。 "这个简单，使用防抖就可以了。"他很快回答。 然而，当我继续追问细节时，他却陷入了沉思 ...

‍ 写在开头 点赞 + 收藏 学会 大家好!。 Code Review 的时候，我最怕看到什么？ 不是复杂的算法，也不是什么正则。而是明明一个 HTML 标签就能搞定的事，有人非要写几百行 JS + CSS 去重新发明轮子 。 前几天，我看到一个新同学为了写一个折叠面板（Ac ...

‍ 写在开头 点赞 + 收藏 学会 aspect-ratio 宽高比 <style> div { width: 190px; /* 注意，这个数字要能容纳完内容才有效 */ aspect-ratio: 16 / 9; background: tomato; } </style> ...

​ wangeditor设置图片宽高默认有30%、50%、100%三种等比缩放选择，但是有的时候需要按照像素控制图片大小不在乎图片是否有拉伸的情况。所以只能编写设置图片宽高的自定义扩展。 ​编辑 1、设置图片大小最好就是与原生一样放置到选中工具栏上最合适，且因为要设置宽高两种属性所以用弹窗嵌套表格方 ...

‍ 写在开头 点赞 + 收藏 学会 “你用 Element Plus 写了个按钮，想改下 hover 颜色，结果死活不生效！最后查了半天，发现得加个 :deep() 才行” 其实，这是 Vue 中一个非常常见的坑：样式作用域冲突。那为什么用 UI 库时，加上 :deep()、:: ...

vue 甘特图 vxe-gantt 自定义任务条插槽模板的用法 https://gantt.vxeui.com 过设置 taskBar 插槽来自定义模板 <template> <div> <vxe-gantt v-bind="ganttOptions"> <template #task-bar-ov ...

‍ 写在开头 点赞 + 收藏 学会 你是否曾经想过，在浏览器中直接点击一个邮件附件，就能预览完整的邮件内容——包括发件人、收件人、抄送、正文甚至内嵌图片？今天，我们要揭秘一个基于 Vue 3 和 Vant UI 的邮件预览上传组件，它不仅能上传 .eml 格式的邮件文件，还能在弹 ...

在使用公司的信息系统时，偶然发现一个下拉组件选择无效，于是看一下前端页面的代码。 前端页面是基于ant Design vue组件开发，JS代码如下，主要用于获取当前登录用户所属的组织机构列表和默认的组织机构 //获取用户信息 const userInfo = tool.data.get('USER_ ...

vue2 甘特图 vxe-gantt 一行渲染多个子任务的配置，但需要在父级任务直接显示所有子任务时，可以通过 task-bar-subview-config 和父级任务设置type= VxeGanttTaskType.Subview 来设置，会自动将所有子任务渲染到父级任务中 https://ga ...

vue甘特图 vxe-gantt 如何将子任务显示一行在父级中，父级行内渲染显示子任务的用法，行内展示子任务由 task-bar-subview-config 和父级任务设置type= VxeGanttTaskType.Subview 来启用。启用后会将所有子任务渲染到父级任务中，可以直观的看到任务 ...

‍ 写在开头 点赞 + 收藏 学会 有一天，甲方打开一个后台管理的项目，说有点卡，不太满意，项目经理叫我优化，重新打包一下。 从输入地址 到 展示 首屏，最佳时间在 3秒内，否则，甲方挂脸，咱就有可能有被裁的风险，understand? 废话不多说，先来看一下怎么个优化法吧。 优 ...

vue表单vxe-form如何多字段联动校验，对一个控件校验多个关联字段。正常的表单场景是一个控件一个字段，那么配置起来非常任意，一个字段对应一个校验规则。当时某些复杂场景就不一样了，比如用户控件，有id/code/role等。比如范围日期选择，一个控件是对应2个字段的，开始日期和结束日期。这个时候 ...

vxe-table 表格 vue 单元格渲染上传附件，显示图片列表，适配上传附件样式的用法，在系统中渲染复制表格时，经常会涉及到附件和图片等上传问题，比如在列表单元格中需要支持上传附件，由于单元格太小，一般的组件根本无法正常显示适配，这时候就可以使用上传附件紧凑模式，通过配置更多按钮来实现。 htt ...

vue 表格 vxe-table 如何设置列默认不显示，用户可以手动通过工具栏设置显示。实现该方式非常简单，可以通过列的 visible 属性设置为默认不显示，然后用户可以在工具栏的自定义列里面勾选显示或隐藏。自定义方式就很方便了。 https://vxetable.cn 通过设置 toolbar- ...

‍ 写在开头 点赞 + 收藏 学会 前端性能优化实战：ECharts地图渲染12万+数据动态动画方案 本文记录了在实际项目中，使用ECharts地图组件渲染12万+设备安装数据的性能优化实战经验，包含完整的技术方案和代码实现。 项目背景 公司需要将全年设备安装量通过旗帜的形式展示 ...