纷享销客开发者手册

简体中文

English

detail.relatedlist.render.before

约 1011 字大约 3 分钟

2025-12-16

该钩子发生在渲染详情页相关对象表格之前调用。 详情页相关对象表格渲染前执行额外的动作，包含且不限于以下功能：

参数

参数说明类型可选值默认值
通用参数详见Object——
targetObjectApiName关联对象apiNameString——

返回结果

参数说明类型默认值
columnsExtendConfig列扩展配置Object--
termExtendConfig场景扩展配置Object--
viewInfoExtendConfig视图扩展配置Object--
actionExtendConfig按钮扩展配置Object--
formatRequestParam格式化List接口请求参数Function--
forceTrWrap列表单元格是否强制换行显示Boolean--
buttons表格右上角通用按钮（示例）Object--
operateBtns表格单行数据操作按钮（示例）Array--

columnsExtendConfig

参数说明类型默认值
filterColumns过滤表格展示的字段，同时影响表格设置和筛选Array--
render单元格自定义渲染配置Object--
showLookupTextlookup字段是否只显示文本（只显示文本意味着不可点击）Booleanfalse

columnsExtendConfig.render

参数说明类型默认值
[ fieldApiName ]字段渲染函数Function--

termExtendConfig

参数说明类型默认值
default默认展示的场景，需要传筛选场景api_nameString--
retain需保留的场景，需要传筛选场景api_nameArray--

viewInfoExtendConfig

参数说明类型默认值
disableDetailOnFullClick点击行不弹出来详情页，主属性字段列除外String--

actionExtendConfig

参数说明类型默认值
[actionApiName]列表右上角按钮配置（注意action大小写，可以通过控制台打印获取）Object--

actionExtendConfig.

参数说明类型默认值
parseParam格式化按钮执行时的参数Function--

formatRequestParam

buttons

参数说明类型默认值
add添加自定义按钮Array--
del删除指定按钮Array--
reset重置按钮名称和行为Array--
retain仅保留指定按钮Array--

operateBtns

参数说明类型默认值
add添加自定义按钮Array--
del删除指定按钮Array--
reset重置按钮名称和行为Object--
retain仅保留指定按钮Array--

基础示例

控制列表不显示某列数据

export default class Plugin {
    apply() {
        return [{
            event: "detail.relatedlist.render.before",
            functional: this.detailListRenderBefore.bind(this)
        }];
    }
    detailListRenderBefore() {
        return Promise.resolve({
            columnsExtendConfig: {
                filterColumns: ['name'], // 过滤主属性字段，使列表不显示主属性列
            }
        })
    }
}

自定义某一列单元格显示内容

export default class Plugin {
    apply() {
        return [{
            event: "detail.relatedlist.render.before",
            functional: this.detailListRenderBefore.bind(this)
        }];
    }
    detailListRenderBefore() {
        return Promise.resolve({
            columnsExtendConfig: {
                render: {
                    // 自定义负责人列的显示内容
                    owner: (value, type, data, format, index, field) => { 
                    	return 'Hello, Fxiaoke';
                    }
                }
            }
        })
    }
}

设置默认筛选场景并保留部分筛选场景

export default class Plugin {
    apply() {
        return [{
            event: "detail.relatedlist.render.before",
            functional: this.detailListRenderBefore.bind(this)
        }];
    }
    detailListRenderBefore() {
        return Promise.resolve({
            termExtendConfig: {
                default: 'InCharge', // 默认展示的场景
                retain: ['All', 'InCharge'] // 需保留的场景
            }
        })
    }
}

扩展列表按钮执行时的参数

export default class Plugin {
    apply() {
    	return this.getHooks();
    }

    getHooks() {
        return [{
            event: 'detail.relatedlist.render.before',
            functional: this.detailListRenderBefore.bind(this)
        }];
    }

    detailListRenderBefore(context, res) {
        return {
            // 1.如何扩展列表右上角按钮执行时的参数
            actionExtendConfig: {
                // 扩展新建按钮
                add: {
                    parseParam: (data) => ({
                        record_type: 'default__c', // 指定业务类型
                        // 重写新建完成之后的回到函数
                        success:function() {
                            res.bizApi && res.bizApi.refresh(); // 刷新详情页
                        }
                    })
                }
            }
        };
    }    
}

formatRequestParam

export default class Plugin {
    apply() {
        return [{
            event: "detail.relatedlist.render.before",
            functional: this.detailListRenderBefore.bind(this)
        }];
    }
    detailListRenderBefore() {
        const formatRequestParam = (data) => {
            const search_query_info = JSON.parse(data.search_query_info);

            if (!search_query_info.filters) {
                search_query_info.filters = [];
            }

            // 追加自定义的筛选条件
            search_query_info.filters.push({
                field_name: 'name',
                field_values: ['value'],
                operator: 'LIKE'
            })

            data.search_query_info = JSON.stringify(search_query_info);

            return data;
        };
        return Promise.resolve({
            formatRequestParam
        })
    }
}

自定义表格右上角按钮

export default class Plugin {
    apply() {
        return [{
            event: 'detail.relatedlist.render.before',
            functional: this.detailListRenderBefore.bind(this)
        }]
    }
    detailListRenderBefore(plugin, context) {
        return Promise.resolve({
            buttons: {
                del: ['IntelligentForm'],
                add: [{
                    action: 'cancel',
                    label: '取消',
                    callback(context) {
                        alert('取消');
                    }
                }],
                reset: [{
                    action: 'BulkRelate',
                    label: '关联插件'
                }]
            }
        })
    }
}

自定义表格单条数据操作按钮

export default class Plugin {
    apply() {
        return [{
            event: 'detail.relatedlist.render.before',
            functional: this.detailListRenderBefore.bind(this)
        }]
    }
    detailListRenderBefore(plugin, context) {
        return Promise.resolve({
            operateBtns: [
                function(){
                    return {
                        del: ['plugin_btn2__c'],
                        add: [{
                            action: 'plugin_btn2',
                            label: '插件-单条按钮2',
                            callback(context) {
                                console.log(arguments, '取消11-operateBtns');
                                alert('取消11');
                            }
                        }],
                        reset: {
                            plugin_btn__c: {
                                action: "plugin_btn__c",
                                label: '插件-单条按钮'
                            }
                    }
                }
            ]
        })
    }
}

常见问题

Q: 通过formatListDataAsync修改数据列表的请求参数，为什么翻页不更新第二页的数据？

A: 请检查formatListDataAsync函数中，是否使用了limit、offset等参数，如果使用了，请将这些参数移除。