随笔分类 - Element
【Element】el-cascader 级联选择，点击文本直接选中
摘要： ```css .el-cascader-panel { .el-radio { width: 100%;
【Element】el-image 预览功能配置
摘要：```html ``` 处理数据 ```ts imgList.push(...res.rows); imgList.forEach((item: any) => { item.imageList = [item.image]; }); ```
【Element】el-dialog 内使用 el-image 并添加 preview-src-list 预览，拖拽导致图片预览不完整问题
摘要：## 现象 el-dialog 内使用 el-image 并添加 preview-src-list 预览，拖拽导致图片预览不完整 ```html ``` ![在这里插入图片描述](https://img-blog.csdnimg.cn/3ef1156885954a4fb5891f69b54f20e4
【Element】ElLoading 自定义动画
摘要：import { ElLoading } from "element-plus"; LoadingInstance = ElLoading.service({ background: "rgba(0, 0, 0, 0.7)", customClass: "ElLoading_class", });
【Element】el-upload 上传图片转 base64 （使用 FileReader）
摘要：FileReader 对象允许 Web 应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容，使用 File 或 Blob 对象指定要读取的文件或数据。 e.target.result 结果
【Element】el-button disabled 为 true 置灰后后不显示外层 tooltip 问题
摘要：可将 el-tooltip 内的 el-button 外层包裹一个容器，如下:
【Element】el-form-item 下 slot="label" 使用 el-tooltip 不显示的问题
摘要：问题描述 el-form-item 使用 label 插槽放入 el-tooltip 不显示（未使用 label-width 和 label-action 属性的情况下）。 解决方法 将标签的样式修改，去掉浮动。 成功！！！
【Element】el-option value 绑定对象类型（item）
摘要：el-option 上绑定的 value 为对象（item），select 上面的 value-key 以 :key 的值作为唯一标识。
【Element】升级到2.15.7升级时报错 $--group-option-flex: 0 0 math.div(1, 5) * 100% !default;
摘要：$--group-option-flex: 0 0 math.div(1, 5) * 100% !default; 解决方法 把 node_modules 和 package-lock.json 删除，再重新 npm install 就可以了。
【Element】调整 el-select 高度之后 箭头错位问题解决
摘要：在调整 el-select 或者 input 高度，比如 .el-input__inner { width: 272px; height: 32px; border: 1px solid #e0e0e0 !important; } 成功之后，el-select箭头错位，情况类似如下图 解决方法 恢复
【Element】el-table-column 使用slot插槽v-if数据更新后没有渲染
摘要：原因是因为表格是element-ui通过循环产生的，而vue在dom重新渲染时有一个性能优化机制，就是相同dom会被复用，通过key去标识一下当前行是唯一的，不许复用，就行了。 在其和其之后的一个显示的组件上添加 :key="Math.random()" <el-table-column :labe
【Element】组件 el-upload 上传文件
摘要：上传文件 手动上传 <el-upload class="add-upload" ref="add-upload" drag action multiple :auto-upload="false" :file-list="fileList" :limit="1" :on-exceed="handle
【Element】深度监听修改elment组件默认样式
摘要：vue可以使用::v-deep <style lang="scss" scoped> ::v-deep .el-main { // 修改ui组件默认样式 }
【Element】表单重置数据只是第一个的问题
摘要：问题就是多渲染表单使用同一个重置方法，如下： resetForm(roleForm) { this.$refs[roleForm].resetFields() } 导致所有表单重置数据均是第一次获得的表单数据 解决方法 给表单添加v-if，在显示的时候，进行表单的销毁和重建，强行让每一次打开表单，改
【Element】级联选择器高度位置不对的问题
摘要：在做电商后台管理系统项目事遇到的问题，可能视频是去年的，element现在已经是新版本了，有些地方修改了，从而导致了以下问题 级联选择器的位置不对 解决的方法就是在全局css中添加以下代码： .el-cascader-menu { height: 300px; } 完美解决！！！
【Element】table 组件出现表格线条不对齐的问题
摘要：在全局css样式中添加以下代码即可： body .el-table th.gutter { display: table-cell !important }
