简体中文
detail.form.render.before
约 612 字大约 2 分钟
2025-09-22
注册一个回调函数,在详情页详细信息组件渲染之前执行;回调函数内可以自定义字段组件以及其他定制逻辑。
- 注册一个回调函数,在详情页详细信息组件渲染之前执行,刷新详情页也会触发回调函数。
- 回调函数内可以自定义字段组件以及其他定制逻辑等。
apply() {
return [
{
event: 'detail.form.render.before',
functional: function (pluginExecResult, options) {
// 详情页详细信息组件渲染之前要执行的逻辑
console.log('custom plugin: detail.form.render.before exec')
}
}
]
}


参数
事件通用参数 pluginExecResult、options 请参考相关文档
返回结果
| 字段 | 说明 | 类型 |
|---|---|---|
| fieldComponents | 要重写的字段组件 | Object |
{
fieldComponents: {
'定制字段的apiName': {
resource: 'custom_plugin', // 必填,固定写死
prop: { // 必填,插件字段组件基本属性
pluginInfo: pluginParam.describe, // 必填,插件基本信息
comInfo: { // 必填,自定义插件字段组件信息
name: '', // 必填,自定义字段组件的名称,来自根目录config.json文件中components节点
prop: {}, // 自定义字段组件属性,会透传到自定义字段组件customProp属性,格式不限
renderMode: '' //自定义字段组件渲染模式,field: 字段整体替换(默认); value: 替换value部分;
}
}
}
}
}可定制字段列表

代码示例
定制联系人姓名字段组件

{
event: 'detail.form.render.before',
functional: function (pluginExecResult, options) {
// 详情页详细信息组件渲染之前要执行的逻辑
return {
fieldComponents: {
'name': {
resource: 'custom_plugin',
prop: {
pluginInfo: pluginParam.describe,
comInfo: {name: 'field', prop: {testprop: 1}}
}
}
}
}
}
}自定义组件内部获取插件入参
**field**组件内部结构及获取插件入参的方法
- 注意:
**properties**中的默认属性context,field,customProp是固定写法,不要修改
Component({
// properties中默认属性是固定写法,不要修改
properties: {
context: {
type: Object
},
field: {
type: Object
},
customProp: {
type: Object
}
},
data: {},
methods: {},
lifetimes: {
attached() {
// 查看插件的入参
console.log('field attached', this.data.customProp.testprop)
}
}
})定制多个字段组件

{
event: 'detail.form.render.before',
functional: function (pluginExecResult, options) {
// 详情页详细信息组件渲染之前要执行的逻辑
return {
fieldComponents: {
'name': {
resource: 'custom_plugin',
prop: {
pluginInfo: pluginParam.describe,
comInfo: {name: 'field', prop: {testprop: 1}}
}
},
'record_type': {
resource: 'custom_plugin',
prop: {
pluginInfo: pluginParam.describe,
comInfo: {name: 'field', prop: {testprop: 1}}
}
}
}
}
}
}