该钩子发生在详情页详细信息组件渲染之前。 渲染对象详情详细信息组件之前执行额外的业务动作，包含且不限于以下功能：

• 字段样式
• 显示全部信息开关

参数

functional用于注册Hook回调函数。执行该Hook时，宿主会向回调函数传入以下参数：

参数	说明	类型	可选值	默认值
context	事件上下文，包含通用参数	Object	--	--
plugin	当前插件运行信息，业务逻辑通常不需要使用	Object	--	--

返回结果

参数	说明	类型	可选值	默认值
fieldComponents	自定义字段组件（示例）	Object	--	{}
componentStyle	组件样式（示例）	Object	--	{}
showAll	是否默认显示全部信息（示例）	Boolean	--	--

普通同步回调直接throw时，异常会由PWC适配层捕获并记录，宿主按Hook未返回结果继续处理。当前Detail包装层不会处理Hook返回rejected Promise的情况（包括async回调中抛出异常），会使详细信息组件一直等待。Hook中执行可能失败的异步操作时，应在Hook内部捕获并上报异常，再resolve可用的返回结果。

fieldComponents[fieldApiName]

fieldComponents以字段apiName为key，value为Vue组件配置。宿主渲染组件时会传入以下props：

参数	说明	类型
field	当前字段描述	Object
data	当前记录的完整详情数据	Object

componentStyle

参数	说明	类型	默认值
fieldLabelStyle	字段标签区域的CSS样式字符串	String	''
fieldValueStyle	字段值区域的CSS样式字符串	String	''
fieldStyle	字段容器的CSS样式字符串	String	''

基础示例

基础用法：

export default class Plugin {
    apply() {
        return [{
            event: 'detail.form.render.before',
            functional: this.renderBefore.bind(this)
        }]
    }
    renderBefore(context, plugin) {
        return Promise.resolve();
    }
}

自定义字段

export default class Plugin {
    apply() {
        return [{
            event: 'detail.form.render.before',
            functional: this.renderBefore.bind(this)
        }]
    }
    renderBefore(context, plugin) {
        return Promise.resolve({
            fieldComponents: {
                field_a3xkc__c: {
                    props: ['field', 'data'],
                    render(h) {
                        return (
                            <div>自定义字段</div>
                        );
                    }
                }
            },
        });
    }
}

组件样式

export default class Plugin {
    apply() {
        return [{
            event: 'detail.form.render.before',
            functional: this.renderBefore.bind(this)
        }]
    }
    renderBefore(context, plugin) {
        return Promise.resolve({
            componentStyle: {
                fieldLabelStyle: 'width: 120px;',
                fieldValueStyle: 'color: #333;',
                fieldStyle: 'min-height: 32px;'
            }
        });
    }
}

显示全部信息

export default class Plugin {
    apply() {
        return [{
            event: 'detail.form.render.before',
            functional: this.renderBefore.bind(this)
        }]
    }
    renderBefore(context, plugin) {
        return Promise.resolve({
            showAll: true // 仅在用户没有本地缓存状态时作为初始值
        });
    }
}