明细
适用场景
用于多行明细数据的录入和展示,例如订单明细、报销明细等
基础能力说明
支持绑定数组类型字段,实现多行明细(数组数据)的录入提交
明细组件目前暂未展示在组件库中,需通过表单容器自动生成,生成方式如下:
在数据模型中创建「数组」类型的字段,元素类型选择「对象」
在该字段中添加子集字段
子集字段可添加几个常规的文本字段,如订单商品、销售数量、销售价格,添加后进行保存
在页面编辑器中,添加表单容器,绑定上述数据模型,页面中会自动生成明细组件
预览区、应用运行态,点击添加按钮,可增加明细行数,点击删除按钮,可删除该行明细
常见场景实践说明
了解更多的表单组件使用场景,可查阅 表单常见场景实践指南
扩展场景说明
组件内部各子组件可灵活调整布局样式
明细组件内部又文本、单行输入等各个组件拼装组成,可灵活调整样式与布局,例如:调整明细表头背景颜色
属性介绍
组件接收的外部传入的属性
属性名 | 属性标识 | 类型 | 属性分组 | 默认值 | 说明 |
---|
绑定字段 | name | string | 基础属性 | "formDetail" | 组件中输入/选择的内容会在提交表单时传入绑定的数据源字段中,并可回显字段中已存储的数据 |
禁用 | disabled | boolean | 基础属性 | false | 是否禁用输入/选择,启用后组件强制显示为只读效果 |
事件介绍
组件暴露的事件,可以监听组件的事件来触发一些外部的动作
事件名 | 事件code | 事件出参 event.detail | 适用情况 | 说明 |
---|
值改变 | onDataChange | 兼容三端 | 组件中的数据内容发生改变时触发 |
组件方法
通过方法 API,可以通过程序触发组件内部的方法,比如提交表单,显示弹窗等
方法名 | 方法标识 | 方法说明 |
---|
新增一行 | addition | - |
删除该行 | remove | - |
值改变 | change | - |