Vue.js论坛 今日: 0|主题: 240|排名: 13 

vue vxe-gantt table 甘特图实现任务可拖拽自动调整日期，通过设置 task-bar-config.drag 启用任务条拖拽功能 效果 代码 设置 task-bar-config.drag 启用任务条拖拽功能 <template> <div> <vxe-gantt v-bind="ganttOptions"></vxe-gantt> </div> </template> <script setup> import { reactive } from 'vue' con ...

vxe-gantt vue table 甘特图子任务多层级自定义模板用法，通过树结构来渲染多层级的子任务，将数据带有父子层级的数组进行渲染 查看官网：https://gantt.vxeui.com/ gitbub：https://github.com/x-extends/vxe-gantt gitee：https://gitee.com/x-extends/vxe-gantt 安装 npm install xe-utils@3.8.0 vxe-pc-ui@4.10.45 vxe- ...

vxe-gantt 甘特图实现产品进度列表，自定义任务条样式和提示信息 查看官网：https://gantt.vxeui.com/ gitbub：https://github.com/x-extends/vxe-gantt gitee：https://gitee.com/x-extends/vxe-gantt 安装 npm install xe-utils@3.8.0 vxe-pc-ui@4.10.45 vxe-table@4.17.26 vxe-gantt@4.1.1 // ... import VxeUIBase fro ...

如何使用 vxe-gantt table 甘特图来实现多个维度视图展示，支持切换年视图、月视图、周视图等，通过 task-view-config 来配置日期轴。 https://gantt.vxeui.com 效果 代码 通过 task-view-config.scales 可以灵活的切换显示模式 <template> <div> <vxe-radio-group v-model="viewMode" @change="changeViewEvent"> ...

如何使用 vxe-table 导出为带图片的单元格到 excel 格式文件 需要注意导出图片时，需确保图片是有效链接，且允许跨域获取，否则不支持导出图片 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee.com/x-extends/vxe-table 通过定义 cellRender 为 VxeImage 来导出图片 ...

vxe-table 使用 spanMethod 合并卡顿的解决方案，当业务需求需要合并时，由于表格数据有几千条，使用该合并后不支持虚拟滚动会卡顿。通过查看官网，发现应该使用 merge-cells 来合并单元格，不仅使用非常简单，还支持虚拟滚动，只需要指定行号和列号，合并数量就可以临时合并单元格，需要注意，官网说明是临时合并。也就是 ...

vxe-gantt 甘特图使用右键菜单，支持表头菜单、内容菜单、表尾菜单，自定义样式，配置项 menu-config={header,body,footer}，实现对按钮的控制，通过 visibleMethod 和 visible | disabled 属性来控制菜单选项的操作权限，可以精确到每一列每一行的显示隐藏与禁用控制 https://gantt.vxeui.com 菜单点击后会触发 menu-cli ...

如何用 vxe-table 实现粘贴数据自动进入新增行与新增列，数据无限扩充，对于大部分业务操作场景，有时需要从 excel 复制数据并粘贴到表格中，由于粘贴的数据会列多于表格定义的行与列，多出的数据需要能支持自动新增与自行新增列，vxe-table提供非常简单的配置方式可以直接支持。 自动新增行 当粘贴数据时，如果粘贴的行数 ...

vxe-table 透视表分组汇总及排序基础配置，对数据进行汇总后，支持对汇总及子项进行排序。 通过拖拽列到聚合列表，自动对数据进行合计汇总。设置 custom-config.allowGroup 和 custom-config.allowValues 启用拖拽功能 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee ...

vxe-gantt table 甘特图如何设置任务视图每一行的背景色，例如给不同任务设置不同背景色。 查看官网：https://gantt.vxeui.com/ gitbub：https://github.com/x-extends/vxe-gantt gitee：https://gitee.com/x-extends/vxe-gantt 效果 代码 通过 task-view-config.viewStyle.cellStyle 设置任务视图行样式，也可以用 task-v ...

作者：vivo 互联网前端团队 - He Yanjun在当代前端开发领域，打字机效果作为一种极具创造力与吸引力的交互元素，被广泛运用于各类网站和应用程序中，为用户带来独特的视觉体验和信息呈现方式，深受广大用户的喜爱。本文将深入介绍在AI搜索输出响应的过程中，打字机效果是怎样逐步演进的。力求以通俗的语言和严谨的思路深入 ...

如何使用 vxe-table 实现虚拟滚动Dom的查找替换功能，excel查找与替换功能 https://vxetable.cn 通过 keyboard-config.isFNR 启用，支持 formatter 内容查找，需要注意如果不希望被随意替换成任意值时应该重写替换方法 查找规则是按照字段实际值进行匹配，如果需要按照自定义的值进行匹配，可以通过 fnr-config.findMethod ...

vxe-table 如何实现跟 excel 一样的筛选框，支持字符串、数值、日期类型筛选 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee.com/x-extends/vxe-table 字符串类型 通过设置 filterRender.cellType='string' 或空默认设置为字符串类型筛选框 <template> <div> ...

vxe-table 实现复制粘贴时，当粘贴时行数不够支持自动增加对应的行，当粘贴数据时，如果粘贴的行数超过表格的行数，可以通过 clip-config.isRowIncrement 自动新增临时行 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee.com/x-extends/vxe-table 效果 代码 通过 cli ...

vxe-table 如何实现拖拽行数据排序，并对拖拽后进行提示框二次确认是否允许拖拽，通过 row-drag-config.dragStartMethod 可以自定义处理拖拽开始时的拖动 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https://gitee.com/x-extends/vxe-table 效果 代码 通过 row-config.drag 和 ...

vxe-table 实现根据单元格渲染的内容自动渲染成统计图、折线图、拼图等图表 效果 代码 <template> <div> <vxe-grid v-bind="gridOptions" @menu-click="menuClickEvent"> </vxe-grid> </div> </template> <script> export default { data() { const gridOptions = { bor ...

vxe-table 如何实现右键菜单异步权限控制，根据后端返回是数据结果来判断按钮选项是否禁用及是否显示。 使用 visibleMethod 在菜单显示时，可以精确到每一列每一行的显示隐藏与禁用控制，非常灵活，不过是同步还是异步都支持 查看官网：https://vxetable.cn gitbub：https://github.com/x-extends/vxe-table gitee：https:/ ...

一、vue-dawn-flow介绍 vue-dawn-flow是一款功能强大的开源流程设计器，专为 Vue.js 生态打造，完美兼容 Vue 2 和 Vue 3 框架。并且能很好的兼容vue前端所有框架。 1.1插件功能 提供了一个可视化的流程设计器，你可以在设计器中拖拽组件，连接组件，设置组件属性。 提供了多种节点类型可共筛选。 提供了节点的相关操作，比 ...

一、前言 该流程设计器（vue-dawn-flow）兼容任何vue前端框架，如element ui 、element plus 、Ant Design Vue、Naive UI‌等。 开箱即用，完全开源。 该流程设计器提供了api、属性、事件、方法等适用功能。 二、使用方式 选择1 npm i vue-dawn-flow 选择2 yarn add vue-dawn-flow 三、文档地址 文档地址：http://1 ...

vxe-table 复制单元格时如何自定义内容，自定义复制的文本内容 默认情况下是复制对应 field 字段值，当需要对特定字段进行格式化或自定义时，就可以通过 copyMethod、pasteMethod 配置可以精确控制复制粘贴的所有行为以及自定义复制粘贴的逻辑控制。比如需要控制某个单元格复制后的值，本来是下拉框的键值，要转成实际值复 ...