element-plus

雪碧聊技术

element-plus中Cascader级联选择器组件的使用目录一.基本使用二.进阶使用1.如何获取最后一级选项的值？2.如何让级联选择器的输入框只展示最后一级？

代码优化——基于element-plus封装组件：表单封装今天实现一个基于element-plus表单组件的二次封装，什么是二次封装？查看以下表单，传统表单组件是不是用<el-form>嵌套几个<el-form-item>即可实现，那么一个表单可不可以实现，传入一个对象给封装组件，通过对象的type值来进行表单的实现。当一个项目有多个不同的表单内容时，能够实现代码的复用性、可读性。

vue3+antV G6节点与文本框实现使用npm下载第三方包：npm install @antv/g6<template><div id="financialMonitoring" v-loading="loading">

一雨方知深秋

pnpm, eslint, vue-router4, element-plus, pinia在设置中配置保存时自动修复husky是一个 git hooks工具（git的钩子工具，可以在特定实际执行特定的命令）

vue3里面，事件触发一次，方法执行多次这个bug也是我在v2升v3的时候，根据上一个前端写的代码，发现的问题现在我们两个组件，父组件 parent 和子组件 son，如果我们在父组件中引入自助件的时候，给他命名是驼峰命名法，然后父组件中又有一个方法和子组件的名字类似，就是驼峰的不一样而已，就可能会出现这种问题

Vue3(elementPlus) el-table替换/隐藏行箭头，点击整行展开element文档链接：https://element-plus.org/zh-CN/component/form.html

在 Vue3 项目中实现计时器组件的使用（Vite+Vue3+Node+npm+Element-plus，附测试代码）记录时间 [2024-12-26]本文讲述如何在 Vue3 项目中使用计时器组件。具体包括开发环境的配置，Vite+Vue 项目的创建，Element Plus 插件的使用，以及计时器组件的创建和使用。

safari 浏览器输入框 focus时不显示那一闪一闪的图标聚焦的时候应该会有一闪一闪的图标结果怎么都不显示使用的 vue3 + element plus 后来发现如果有 placeholder 属性就算只给 placeholder属性设置个空格都能聚焦，不知道是什么问题呢

vue3 + ts 使用 el-tree实现效果：代码：

el-selet下拉菜单自定义内容，下拉内容样式类似表格

nothing_more_than

draggable的el-dialog实现对话框标题可以选择请看图这个对话框使用了el-dialog并且draggable属性设置成了true，所以标题栏这里就可以拖动，现在用户想选中标题栏的文本进而复制。我看到这个需求头都大了。我能想到的方案有三个：1. 取消draggable为true 2. 标题文案后面加一个复制按钮 3. 标题栏中文案那块区域不触发移动操作

优化表单交互：在 el-select 组件中嵌入表格显示选项介绍了一种通过 el-select 插槽实现表格样式数据展示的方案，可更直观地辅助用户选择。支持列配置、行数据绑定及自定义搜索，简洁高效，适用于复杂选择场景。完整代码见GitHub 仓库。

半度℃温热

ERROR TypeError: AutoImport is not a function原因：unplugin-auto-import 插件版本问题

el-table 行列文字悬浮超出屏幕宽度不换行的问题修改前的效果修改后的效果 ui框架 element-plus 在网上找了很多例子都没找到合适的然后这个东西鼠标挪走就不显示控制台也不好调试看了一下El-table的源码他这个悬浮文字用的el-prpper 包着的所以直接改 .el-table .el-propper 设置为max-width:1000px 就可以了吐槽一下测试是真的狗硬生生把数据库字段长度改了要我同步数据库长度然后弄出来这么个问题用户实际场景中都用不到我想说我们这个测试脏累活干多了现在心理极度扭曲这种事真没少

vue3使用element-plus，树组件el-tree增加引导线element-plus组件库的el-tree样式因为element的样式不满足当前的的需求，UI图，所以对el-tree进行增加了引导线修改样式如下，增加引导线，并且实现增删，输入框

element-plus按需引入报错AutoImport is not a function官网文档：快速开始 | Element Pluswebpack配置运行结果：TypeError: AutoImport is not a function

vue el-table组件实现展开行默认展开全部获取数据的时候文档地址

element-plus版本过老，自写选项弹框增删功能发现代码怎么都用不了el-select的#footer插槽从而实现不了相关的操作，发现el-select自带的管理相关数据的属性popper-class用不了。

pnpm install安装element-plus的版本跟package.json指定的版本不一样pnpm安装的版本不同于package.json中指定的版本可能是由于以下几种情况导致的：解决这个问题的方法如下：

UI 组件的二次封装UI 组件的二次封装是指，在基础 UI 库的组件上进行自定义封装，以实现更贴合业务需求的功能和样式。通过二次封装，可以增强组件的复用性、便捷性和一致性，简化业务代码，同时降低后续维护成本。