博客 / 列表

可不簡單 - vxe-table 使用 spanMethod 合併卡頓的解決方案

vxe-table 使用 spanMethod 合併卡頓的解決方案,當業務需求需要合併時,由於表格數據有幾千條,使用該合併後不支持虛擬滾動會卡頓。通過查看官網,發現應該使用 merge-cells 來合併單元格,不僅使用非常簡單,還支持虛擬滾動,只需要指定行號和列號,合併數量就可以臨時合併單元格,需要注意,官網説明是臨時合併。也就是合併後如果不重新更新列或者重新加載數據,是沒問題的,但是需要需要重

前端

可不簡單 - vxe-table 透視表分組彙總及排序基礎配置

vxe-table 透視表分組彙總及排序基礎配置,對數據進行彙總後,支持對彙總及子項進行排序。 通過拖拽列到聚合列表,自動對數據進行合計彙總。設置 custom-config.allowGroup 和 custom-config.allowValues 啓用拖拽功能 查看官網:https://vxetable.cn gitbub:https://github.com/x-extends

前端

可不簡單 - vxe-gantt table 甘特圖如何設置任務視圖每一行的背景色

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-con

前端

可不簡單 - 如何使用 vxe-table 實現虛擬滾動Dom的查找替換功能,excel查找與替換功能

如何使用 vxe-table 實現虛擬滾動Dom的查找替換功能,excel查找與替換功能 https://vxetable.cn 通過 keyboard-config.isFNR 啓用,支持 formatter 內容查找,需要注意如果不希望被隨意替換成任意值時應該重寫替換方法 查找規則是按照字段實際值進行匹配,如果需要按照自定義的值進行匹配,可以通過 fnr-config.findMethod

前端

可不簡單 - vxe-table 如何實現跟 excel 一樣的篩選框,支持字符串、數值、日期類型篩選

vxe-table 如何實現跟 excel 一樣的篩選框,支持字符串、數值、日期類型篩選 查看官網:https://vxetable.cn gitbub:https://github.com/x-extends/vxe-table gitee:https://gitee.com/x-extends/vxe-table 字符串類型 通過設置 filterRender.cellType='

前端

可不簡單 - vxe-table 實現複製粘貼時,當粘貼時行數不夠支持自動增加對應的行

vxe-table 實現複製粘貼時,當粘貼時行數不夠支持自動增加對應的行,當粘貼數據時,如果粘貼的行數超過表格的行數,可以通過 clip-config.isRowIncrement 自動新增臨時行 查看官網:https://vxetable.cn gitbub:https://github.com/x-extends/vxe-table gitee:https://gitee.com/

前端

可不簡單 - vxe-table 如何實現拖拽行數據排序,並對拖拽後進行提示框二次確認是否允許拖拽

vxe-table 如何實現拖拽行數據排序,並對拖拽後進行提示框二次確認是否允許拖拽,通過 row-drag-config.dragStartMethod 可以自定義處理拖拽開始時的拖動 查看官網:https://vxetable.cn gitbub:https://github.com/x-extends/vxe-table gitee:https://gitee.com/x-ext

前端

可不簡單 - vxe-table 實現根據單元格渲染的內容自動渲染成統計圖、折線圖、拼圖等圖表

vxe-table 實現根據單元格渲染的內容自動渲染成統計圖、折線圖、拼圖等圖表 效果 代碼 template div vxe-grid v-bind="gridOptions" @menu-click="menuClickEvent" /vxe-grid /div /template script export default { da

前端

可不簡單 - vxe-table 如何實現右鍵菜單異步權限控制

vxe-table 如何實現右鍵菜單異步權限控制,根據後端返回是數據結果來判斷按鈕選項是否禁用及是否顯示。 使用 visibleMethod 在菜單顯示時,可以精確到每一列每一行的顯示隱藏與禁用控制,非常靈活,不過是同步還是異步都支持 查看官網:https://vxetable.cn gitbub:https://github.com/x-extends/vxe-table gi

前端

可不簡單 - 如何使用 vxe-table 展開行實現展開子表父子表格

如何使用 vxe-table 展開行實現展開子表父子表格 查看官網:https://vxetable.cn gitbub:https://github.com/x-extends/vxe-table gitee:https://gitee.com/x-extends/vxe-table template div vxe-grid v-bind="gridOptions"

前端

可不簡單 - vxe-table 樹形表格顯示連接線的方式

vxe-table 樹形表格顯示連接線的方式 完整連接線 通過 tree-config.showLine 來啓用是否顯示連接線 template div vxe-grid v-bind="gridOptions"/vxe-grid /div /template script setup import { reactive } from 'vue' const gridOpti

前端

可不簡單 - vxe-table 如何自定義排序圖標按鈕,自定義排序

vxe-table 如何自定義排序圖標按鈕,自定義排序 查看官網:https://vxetable.cn gitbub:https://github.com/x-extends/vxe-table gitee:https://gitee.com/x-extends/vxe-table 使用表頭排序按鈕插槽 sort 來自定義模板 template div vxe-g

前端

可不簡單 - vxe-table 複製單元格時如何自定義內容,自定義複製的文本內容

vxe-table 複製單元格時如何自定義內容,自定義複製的文本內容 默認情況下是複製對應 field 字段值,當需要對特定字段進行格式化或自定義時,就可以通過 copyMethod、pasteMethod 配置可以精確控制複製粘貼的所有行為以及自定義複製粘貼的邏輯控制。比如需要控制某個單元格複製後的值,本來是下拉框的鍵值,要轉成實際值複製到 excel,這時候就可以使用該轉換函數了 查看官

前端