EditableTable

特殊属性

EditableTable 组件需要一个特殊属性 fieldConfig。

配置示例：

{
  "fieldConfig": {
    "pbcToken": "",
    "formEntityToken": "",
    "relations": [
      {
        "colId": "parentDataId",
        "filterType": "text",
        "type": "equals",
        "filter": "$CURRENT_FORM_DATA_ID"
      }
    ]
  }
}

容器属性

所有组件配置的第一层均支持容器属性

组件属性 componentsProps

Name	Type	Default	是否支持 Variable Pattern	Description
className	string		✔️	组件的 className
style	object			组件的 style
simpleMode	bool	false		如果设置 `true`, 在提交的时候全部发送给请求；如果设置 `false`，在提交的时候会自动识别成 `{ inserted, updated, deleted }` 的增量修改模式。
columnDefs	array			表格的列的定义，支持 ag-grid 所有的 columnDefs
defaultColDef	object			ag-grid 默认列的属性
dataUrl	ConditionalListOrSinglePropertyPropType(string)			通过 `dataUrl` 获取数据。
defaultValueDataUrl	string			表格默认值, 加载后放在inserted内
dataFilters	ConditionalListPropertyPropType(DataFilters)		✔️	请求数据源隐藏的固定 filter 条件，无法通过界面进行改变
dataResponseKeyPath	string	'results'		取 response data 里的某一个子数据来作为结果。
transformDataResponse	string			转换取到的数据，使用 eval 表达式，this 指向获取到的数据。
transformDefaultValueResponse	string			转换从 `defaultValueDataUrl` 获取到的数据，使用 eval 表达式，this 指向获取到的数据
canAddRow	bool	true		是否支持增加行
newRowDefaultValues	object			新增行的默认值
maxRowCount	number	Infinity		可增加的最大行数
canDeleteRow	bool	true		是否支持删除行
triggerDataFetchedOnGridReady	bool	true		dataFetched 事件是否需要等到 grid ready 之后保证 gridApi 有值过后才触发

所有其余 componentsProps 将会被传给组件根元素（Table）。

JS API

通过 formApi.getFieldApi() 获取的接口如下：

Name	Type	Description
node	HTML Element	组件的根 DOM 元素
on	func	绑定到组件的事件
gridApi	object	Ag-Grid 的 api 接口, 官方文档
getComponentProps	() => object	获取组件配置的所有 `componentProps`
updateComponentProps	() => void	更新组件的 `componentProps`
refresh	() => void	刷新表格数据
isSimpleMode	() => bool	是否为 `simpleMode` 模式
getRowData	() => array	获取表格所有数据
getOldRowData	() => array	获取表格编辑前的所有数据
getChangedData	`() => { inserted: [], updated: [], deleted: [] }`	获取表格计算的修改数据
addRow	(rows) => void	往表格添加一行或多行新数据，参数 rows 数据里不需要有 id 属性，表格会自动添加随机 id，并且在提交数据的时候删除它
updateRow	(rows) => void	修改表格的某一行或多行数据，靠 rows 数据里的 id 来标识修改的是哪行
removeRow	(rows) => void	删除表格的某一行或多行数据，靠 rows 数据里的 id 来标识修改的是哪行
getSelectedIds	(rows) => array	返回表格选中行的所有 `id` 组成的数组

on eventType

Name	callback	Description
dataFetched	(formApi) => array	当表格通过数据源配置获取到数据后触发
addRow	(formApi) => array	当表格新增行时出触发
deleteRow	(formApi) => array	当表格删除行时触发

特殊属性​

容器属性​

组件属性 componentsProps​

JS API​

on eventType​

特殊属性

容器属性

组件属性 componentsProps

JS API

on eventType