使用element插件中Descriptions遇到的坑

055_Descriptions描述列表 1. Descriptions描述列表 1.1. 列表形式展示多个字段。 1.2. Descriptions Attributes 参数 说明 类型 可选值 默认值 border 是否带有边框 boolean 无 false column 一行Descript 阅读详情

使用Descriptions 描述列表中的自定义label,打包后点击按钮新增一个el-descriptions-item时,最后一个item的标题发生改变
在这里插入图片描述
解决办法:
将以下代码替换

<el-descriptions-item label-align="center">
            <template #label>
                <div class="cell-item">
                    <span class="f_validate">*</span> 工作单位职务
                </div>
            </template>
            <el-form-item prop="dw">
                <el-input v-model="dw" placeholder="" />
            </el-form-item>
        </el-descriptions-item>

改成:

<el-descriptions-item label-align="center" label="工作单位职务" label-class-name="setred">
            <el-form-item prop="dw">
                <el-input v-model="dw" placeholder="" />
            </el-form-item>
        </el-descriptions-item>

给label栏添加红色字体的*
在<el-descriptions-item>标签上添加label-class-name=“setred”,给当前表添加class

<style>
.setred::before{
    content: "*";
    color: red;
    font-weight: bold;
    font-size: 16px;
}
</style>
Vue3开发平台内置组件库:Element Plus平台化改造与AI物料系统实践 在现代前端工程化实践中,组件化开发是提升效率和维护性的核心理念。其原理在于将UI界面拆分为独立、可复用的代码单元,通过标准化接口实现组合与通信。这一技术价值在于统一设计规范、降低重复开发成本,并支撑团队协作。在Vue.js等框架生态中,组件库的应用场景尤为广泛,尤其在中后台管理系统开发中,能够快速构建一致的用户界面。然而,直接使用开源UI库常面临样式定制、行为统一和团队规范等挑战。为此,对Element Plus等成熟组件库进行平台化改造,通过全局配置、主题定制和业务封装,形成标准化的内置组件资产,成为关键 阅读详情

相关推荐

Vue3项目实战:从零搭建一个带撤销/恢复和属性面板的BPMN流程设计器(避坑指南)

本文详细介绍了如何基于Vue3和bpmn.js构建专业级BPMN流程设计器,重点讲解了撤销/恢复功能和属性面板集成的实现方法。通过实战案例和避坑指南,帮助开发者快速掌握Vue3.0与bpmn.js的深度整合技巧,提升企业级流程管理系统的开发效率。

ateu52935的博客 474

解决el-descriptions的label-class-name不生效问题

解决el-descriptions的label-class-name不生效问题

一只没有脚的鸟 5688

从代码层面分析STM32 标准库和HAL库的差异

相当于每个设置都是独立的函数。HAL库将一段代码通过宏定义的方式封装成了一个函数,每个端口的时钟都单独的定义了一个名称,标准库是一个独立的函数,通过参数传递的方式来设置每个端口的时钟。这两个版本的函数本质上操作的还是寄存器,不过HAL库操作的只是BSRR寄存器,而标准库端口置1的时候操作的是BSRR寄存器,端口清0的时候操作的是BRR寄存器。标准库设置端口模式的时候,是在if语句中判断之后直接设置的,而HAL端口模式设置时,却使用了switch语句去设置,说明在HAL库中,端口模式和标准库中发生了改变。

HXYDJ的博客 2万+

[element-ui] el-descriptions站位,换行用法

需要将el-descriptions-item换行用法:使用span(1)span 代表占位,当span 的值大于 column的值,就会自动换一行(2)span:元素占据的列数,默认为1。默认每个item占据一个格子。

Ls66666Ls的博客 1万+

TwinCAT3 主站动态配置 PDO 的实战技巧与性能优化

本文深入探讨了TwinCAT3主站动态配置PDO的实战技巧与性能优化策略。通过对比静态PDO的局限,阐述了动态配置在提升系统灵活性、降低网络负载和保障实时性方面的核心优势。文章提供了从环境准备、代码实现到错误排查的完整流程,并重点解析了PDO映射、SDO通道区别以及分布式时钟同步等关键概念,帮助工程师掌握EtherCAT网络性能调优的核心方法。

weixin_29213525的博客 346

新手网工别慌!手把手带你搞定华为OLT开局配置(从登录到业务下发全流程)

本文为新手网络工程师提供华为OLT设备开局配置的详细指南,涵盖从设备登录、基础配置到业务部署的全流程。通过实战案例和常见问题排查,帮助读者快速掌握华为OLT配置技巧,确保业务顺利开通。

weixin_33721344的博客 481

el-descriptions的使用

js、element-ui、vue、el-descriptions

2201_75705263的博客 5664

Rasa Core开发指南

文章目录1. Rasa Core简介1.1 Rasa Core消息处理流程1.2 安装Rasa Core2. Dialogue模型训练2.1 Story样本数据2.2 Domain2.2.0 intents2.2.1 actions2.2.2 templates2.2.3 entities2.2.4 slots3 .训练和使用对话模型3.1 训练对话模型3.2 使用对话模型4. 搭建CustomA...

老蒋也疯狂 1万+

element插件Descriptions中使用v-if的el-select插件出现值混乱

问题描述 使用v-if后,页面中的性别选择框和下方的学历选择框一致了 解决方法 在性别选框的<el-form-item>中添加:key=“Math.random()” <template v-if="formData.idnotype > 1"> <el-descriptions-item label-align="center" name="sex" label="性别" label-class-name="setred"> <el

xioxi 2379

ISO26262 功能安全各个阶段测试要求

1. 开发过程说明 系统层面:包括软硬件集成测试、系统集成测试以及整车测试。 硬件层面:包括硬件集成与测试。 软件层面:单元测试、集成测试。 2. 功能安全总体要求 2.1 各项指标 2.2 诊断覆盖度举例 针对一个信号举例说明: 3. 功能安全测试要求 3.1 测试计划 核心内容应包括, 测试对象:需要测试的对象描述,以及测试的范围描...

AgingMoon的博客 1万+

华为非AI方向0603笔试真题-爆破小游戏(详细思路+多语言题解)

华为非AI方向0603笔试第二题【爆破小游戏】,提供详细思路讲解以及代码实现。

qq_45776114的博客 358

element ui 组件踩坑记录--后台管理系统-最全

说明:很久没有开发过后台管理系统,elementui都好久没有用过了,踩了一些小坑,特意记录下: element 特点:a.组件的一般输入的值/可以选择的值,都是绑定在v-model 上面 b. 在组件上面绑定值,一般来说需要 :属性名=属性值 ,这个写法 c. 在组件上面设置 style=“width: 300px” 可以直接修改组件的宽度 1. input 组件–输入框 ,防止用户输入空格-在v-model 后面加上 .trim: <el-form-item label="任务

凉城玖的博客 2612

C++(Qt)软件调试---内存分析工具Heob(26)

绝对最全面最详细的Heob使用说明。(图文并茂) 绝大部分的文章都说Heob是一个内存泄漏分析工具,其实Heob只是内存泄漏分析功能比较突出,实际上Heob可以分析很多内存问题。 Heob是一个Windows下检测缓冲区溢出(野指针、空指针、内存越界、重复释放、异常捕获等)和内存泄漏的工具,集成到Qt Creator中,功能强大,简单容易上手。

mahuifa的博客 4312

naive-ui Descriptions 组件完整指南:从基础用法到源码级原理

naive-ui(A Vue 3 Component Library. Fairly Complete. Theme Customizable. Uses TypeScript. Fast.)的 `Descriptions`(描述列表)组件用于以结构化表格形式清晰地展示一组内容条目,常用于详情页、订单信息、用户资料等“只读数据展示”场景。本文以 [src/descriptions/demos/en

gitblog_00259的博客 805

6、硬件工程师笔试面试知识器件篇——电容(2025版本)

本文系统介绍了电容器的基本原理、类型分类、应用场景及相关设计问题。首先阐述了电容的定义、工作原理及计算公式,详细分析了陶瓷、电解、薄膜、钽等不同类型电容的特性差异。针对高频电路设计,重点讨论了如何评估和优化电容器的寄生效应(ESR/ESL)、频率特性、温度特性等关键参数。文章还提供了PCB布局优化策略,包括缩短走线、多层板设计、去耦网络配置等方法。最后涵盖了电容器寿命计算、稳定性评估及电源电路设计中的纹波电流处理等实用内容,为硬件工程师提供了全面的电容器选型和应用指南。

XU157303764的博客 3872

蓝牙模块HM-10手册

蓝牙模块HM-10手册,该手册对蓝牙模块HM-10进行了详细的介绍和使用方法以及一些AT指令。

Element Plus 入门教程:3 步跑通,用业务场景学会选组件

做 Vue 3 后台系统,起步前总要纠结三件事:组件库选哪个、怎么引入、主题怎么改。Element Plus 是 Element 团队维护的 Vue 3 UI 组件库,用原生 TypeScript 编写,基于 Composition API 构建,内置 80 多个组件。如果你是要搭建后台系统或 B 端页面的前端开发者,这篇文章用大白话讲清楚:它怎么跑起来、什么页面该用哪些组件、主题怎么改、以及新手

gitblog_00591的博客 365

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

Element Plus 上手指南:Vue 3 中后台开发的完整组件库

Element Plus 是 Element 团队出品的 Vue 3 UI 组件库,100% TypeScript 编写、基于 Composition API,内置 60 多个企业级组件,覆盖表单、表格、导航、反馈等中后台开发的全部高频场景,免费开源。本文带你先跑通,再讲清原理。 ## 接到一个中后台需求,你手头有什么 周五下午接到需求:一个员工管理后台,要表格、要筛选表单、要弹窗操作、要暗黑

gitblog_07120的博客 423

Camera2Demo

在Camera2 的基础上进行封装,使得Camera2一堆初始化逻辑与Activity分离,降低耦合度,完成预览拍照并保存的操作

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

Element Plus 快速上手指南:从零搭出企业级 Vue 3 界面

Element Plus 是 Element 团队基于 Vue 3 打造的组件库,开箱即用地提供表单、表格、导航、反馈等几十种现成组件,帮你用最短时间搭出风格统一的企业级界面。这篇文章按"能解决什么问题 → 怎么跑起来 → 怎么用好"的顺序,带你从零走一遍完整流程。 ## 一个后台页面要写多少重复代码?组件库替你省掉什么 做过中后台项目的人应该都有体会:一个普通的列表页,就包含顶部导航、面包屑

gitblog_00754的博客 757

一文读懂 Element Plus:60+ 组件构建 Vue 3 后台管理系统的完整方案

Element Plus 是 Element 团队面向 Vue 3 打造的开源 UI 组件库,提供 60 多个组件,源码全部使用 TypeScript 编写,内置主题定制、虚拟滚动与按需加载机制。如果你的技术栈是 Vue 3 + Vite,正在找一个能支撑中后台业务的中后台组件库,它基本可以覆盖从登录页到数据看板的全部界面需求。 ## 先看看它能搭出什么界面 一个典型的中后台页面长这样:顶部导

gitblog_00479的博客 194

element-ui 表格数据时间格式化的方法(无插件)

使用场景: 当el-table 的列表 中包含时间格式的数据,对其进行格式化操作; 效果: 格式化为 'yyyy-MM-dd' 形式; 操作步骤: 在列中绑定formatter 该属性 其中dateFormat是格式化操作的逻辑;过滤出需要格式化的列的prop即可 /** * @description: 格式化日期 * @param {*} row * @param {*} column * @return {*} * @aut

Fishman113的博客 9092

PostGraphile 定制化总览:从数据库对象、Smart Tags 到 Presets 与插件扩展

PostGraphile(v5,即 Grafast 时代版本)的核心设计理念是"以数据库为中心":你精心设计的 PostgreSQL 数据库 schema 会自动被提取为一份符合最佳实践的 GraphQL API。本篇指南系统梳理 PostGraphile 定制化的三大主线——**数据库对象设计**、**注释/注解(smart comments 与 smart tags)**、**配置与插件扩展*

gitblog_01013的博客 773

【亲测免费】 Pure Admin Thin 使用教程

Pure Admin Thin 是基于 Vue Pure Admin 提炼出的一个精简版框架,旨在提供一个包含主体功能、更适合实际项目开发的脚手架。该项目的特点是打包后的大小在全局引入 Element-Plus 的情况下仍然低于 2-3MB,并且会永久同步完整版的代码。开启 Brotli 压缩和 CDN 替换本地库模式后,打包大小低于 350KB。 ## 项目快速启动 ### 环境准备 确保...

gitblog_01165的博客 767

element提示 vscode添加_VSCode合理配置ESLint+Prettier

前言昨天,我的开源项目成员给我提交了代码,我在用webstorm看他的代码时发现了一堆跟代码格式相关的黄色报错,我就问他这一堆黄色报错你的编辑器就没给你提示吗?他说他用的vscode没有提示这些报错。于是,我就亲自下载了vscode搞了下发现真没提示,在百度和掘金搜了下vscode配置eslint+prettier的文章没有一个好使的,终于在踩了很多坑后,配置成功了。本文就跟大家分享下如...

weixin_42395219的博客 472

vscode vue3 typescript开发环境搭建

今天搞一下vue3环境,用这玩意看看好使不。vue2早期的语法看起来真实够呛,嵌套比较深。以前看过一个妹子写的react代码,发现里面很多js在控制样式和html,三个东西揉在一块也是厉害了。不知道是不是react本身的风格。vue3本身风格要接近原生js了,提倡组合式API,但是还是有些距离。从语法使用上来说还是早期原生js风格统一,没有各种套路,都是拿来就用,纯组合。这组件方开发感觉看起来不直白,一个页面里面很多自定义组件,不看源码不知道时啥玩意。比如<MyComp/>这时啥玩意?

yanghuashuiyue的专栏 1437
上一篇: vite + element项目按需引入后将语言设置为中文
下一篇: navigator.mediaDevices.getUserMedia中getUserMedia显示未定义
if时光重来
博客等级 码龄8年 248粉丝 217原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值