vue+element-ui el-descriptions 详情渲染组件二次封装（Vue项目）

一般后台管理系统，通常页面都有增删改查；而查不外乎就是渲染新增/修改的数据（由输入框变成输入框禁用），因为输入框禁用后颜色透明度会降低，显的颜色偏暗；为解决这个需求于是封装了详情组件

在这里插入图片描述

1、详情页面value值可以自定义插槽
2、详情页面value值可以自定义tip(提示)
3、字典类型（即后台返回的是数字类型）过滤转成中文
1
2
3

<t-detail :descData="descData" />
1

参数	说明	类型	默认值
descData	详情页面数据源	Array	无
----label	详情字段说明标题	String	无
----value	详情字段返回值	String	无
----fieldName	value 返回值的字段	String	无
----slotName	插槽（自定义 value）	slot	无
----span	占用的列宽，默认占用 1 列，最多 4 列	Number	1
----tooltip	value 值的提示语	String/function	无
----filters	字典类型（即后台返回的是数字类型）过滤转成中文	Object	无
-------list	字典 list 定义的数据名即 listTypeInfo 里面对应的值	String	无
-------key	下拉数据源的 key 字段	String	‘dictValue’
-------label	下拉数据源的 label 字段	String	‘dictLabel’
dataList	开启 filters 时详情接口返回的数据	Object	{}
listTypeInfo	开启 filters 时下拉数据源	Object	{}

在这里插入图片描述

在这里插入图片描述

相关阅读:
百万长链接优化建议
通过Demo学WPF—数据绑定（二）
Oracle Forms 编译时ORA-01445和 FRM-40501错误
计算机网络 | 第一章认识计算机网络 | 王道考研笔记自用
【数据结构-链表】链表的相关算法
学习鸿蒙-应用市场申请签名
“智慧”北京，人工智能引领“新风尚”
yolov5官方开源项目地址github记录一下
【Opencv450】HOG+SVM 与Hog+cascade进行行人检测
跨境干货 | 如何搭建自己的独立站？

原文地址：https://blog.csdn.net/cwin8951/article/details/126412703