@element-plus / 博客 RSS 訂閱

Jun 07 2024

水冗水孚 - Vue3中使用hook實現按住Shift快速勾選el-table功能

需求描述 最近產品説，某個el-table要實現按住shift鍵快速勾選功能 大概就是仿windows系統的文件shift按住選中功能 反正就是儘可能多的讓用户勾選 方便用户快速勾選操作 github完整代碼：https://github.com/shuirongshuifu/vue3-echarts5-example Windows系統的功能效果圖 比如可以向前多選 或者向後多

hooks , vue3 , element-plus , hook

收藏 評論

Aug 06 2025

十五 - Tailwind Css 中使用 Element Plus 主題系統的方案與實現

前言 本篇文章主要講解在 Tailwind Css 中配置 Element Plus 主題變量以統一視覺設計 本文也是《通俗易懂的中後台系統建設指南》系列的第九篇文章，該系列旨在告訴你如何來構建一個優秀的中後台管理系統 需求概括 上一篇文章中我們講解了生成 Element Plus 主題色階和動態切換主題色：一篇文章實現 Element Plus 色彩動態切換 Clean Admin 中使用 Ta

vue.js , tailwind-css , element-plus , typescript , 前端

收藏 評論

May 27 2025

水冗水孚 - 實現el-table中輸入框單元格的上下左右鍵快捷切換

需求描述 最近有一個需求，就是用户説，不習慣使用tab鍵做輸入框input的光標切換 （tab鍵盤沒法回到之前的input光標，只能走了一圈後再回到原點那種） 用户喜歡使用上下左右鍵，來進行輸入框切換 基於這個需求下，便有了本篇文章的示例 示例演示網站：http://ashuai.work:8890/30 github：https://github.com/shuirongshuif

vue.js , element-plus , Javascript

收藏 評論

Nov 06 2025

wei4118268 - [vue-cli3/element-plus] 從菜單渲染淺談動態渲染Vue組件的問題

1. 關於Element-plus的菜單渲染問題 跨過了Element-UI，終於來到了Element-plus。又回到了一個老問題，menu的渲染。 創建一個menu數組，利用v-for來渲染數組，生成menu，非常常規的操作。但是操作的過程中，出現了一個小問題，就是關於icon的渲染。 我們知道，在Element-plus中，渲染一個帶圖標的菜單項，是這麼搞的： el-menu-i

vue-cli3 , component , icon , element-plus , 前端

收藏 評論

Nov 03 2025

水冗水孚 - 實現el-table樹結構表格展開摺疊且合併單元格功能（兩種思路）

需求描述 樹結構表格 可展開摺疊，有children子集項 並且對應列還需要合併單元格（大類合併） 筆者試了試 使用el-table自帶的樹結構表格似乎沒法實現 就這個：:tree-props="{children: 'children', hasChildren: 'hasChildren'}" 於是，只能換種思路實現了 添加行、刪除行方式，同時動態計算需要合併的單元格信息 效

vue.js , element-plus , element-ui

收藏 評論

Nov 05 2025

水冗水孚 - 算法的應用場景之尋找最近數&時間線組件錨點跳轉對應位置

需求描述 前兩天和以前公司的同事聊天，他提到在刷leetcode，並提到算法感覺不接地氣 似乎也沒有什麼應用場景 於是乎，筆者翻出一個案例需求給到他 看完以後，他感嘆道： 還是自己見得少了... 需求：假設有一個時間線組件，按照時間順序展示對應內容，如下圖 這個時間線可能很長，能有好幾個月 為了提高用户體驗，當用户進入這個頁面的時候 我們需要看看當天是哪一天，同時滾動到，距

vue.js , leetcode , element-plus

收藏 評論

Nov 04 2025

肥皂泡 - vite+vue3+element-plus自定義主題變量的配置説明

先上配置，具體參數後面説 vite.config.ts 文件 // vite.config.ts import { defineConfig } from 'vite' import ElementPlus from 'unplugin-element-plus/vite' // 用於 API 組件樣式 import Components from 'unplugin-vue-components

vite , vue3 , element-plus

收藏 評論

Dec 08 2021

shellingfordly - Vele-Admin 一個基於Vue3+Element-Plus的後台管理系統

vele-admin 介紹 vele-admin是一個基於 vue3, vite2, element-plus, vuex-module-decorators, vue-router-next, typescript 的後台管理系統 倉庫 Github vele-admin 預覽 vue3-element-plus-admin瀏覽地址 依賴 Vue3 Vue-Router-Next V

mock.js , vite , vue3 , element-plus , typescript

收藏 評論