锦日外贸论坛百度seo在线优化

场景业务：

多次运用AgGridReact的table 列表

思路：

运用自定义hooks进行二次封装：
通用配置例如：传参的参数，传参的url，需要缓存的key这些键值类
定制化配置例如：需要对table 的一些定制化传参，是否需要分页，表头配置，表头搜索配置

通用配置：

  const { SettingTableRender, TableListRender, getTableData,resetSesstion,tableData } = useTableModule({renderKey: {companyName: renderContext,contacts: EllipsisCommont,industries: industriesCell,serviceTypes: bdInfosServiceTypes,businessProgress: bdInfosBusinessProgress,latestFollowUpDate,latestNoteCreatedTime,associationLabel,estimatedDealDate,dealDate:dealTime,website:websiteCell,salesLeadOwner:ownerCell,businessOpportunityLeader:ownerCell,accountManager:ownerCell},configKey: 'COMPANY_AFFILIATES',tableUrl: 'apiurl',tableRequest: getTableList,setParamsList,sessionKey:'tableList'});

定制配置：

    {/* 列表 */}{TableListRender({pagination: false,customColumn,key: tabActive,filterSearchRender: {companyName: {render: SelectCompanyName,},contacts: {render: SelectCompanyName,},associationLabel: {render: Select,tPropty: {options: associationLabelOp,},},industries: {render: TreeSelect,tPropty: {treeData: listEnum('industry'),showCheckedStrategy: TreeSelect.SHOW_PARENT,treeCheckable: true,treeNodeFilterProp: 'label',fieldNames: { value: 'id', label: 'label', children: 'children' },},},serviceTypes: {render: TreeSelect,tPropty: {treeData: listEnum('serviceType'),showCheckedStrategy: TreeSelect.SHOW_PARENT,treeCheckable: true,treeNodeFilterProp: 'label',fieldNames: { value: 'name', label: 'label', children: 'children' },},},businessProgress: {render: TreeSelect,tPropty: {treeData: listEnum('businessProgress').filter((i) =>['ACCOUNT_BUSINESS_NOT_FOLLOWED_UP','ACCOUNT_BUSINESS_CUSTOMER_NOT_CONTACTED','ACCOUNT_BUSINESS_PLAN_COMMUNICATION','ACCOUNT_BUSINESS_PLAN_VERIFICATION','ACCOUNT_BUSINESS_NEGOTIATION','ACCOUNT_BUSINESS_CONTRACTED','ACCOUNT_BUSINESS_LOST',].includes(i.name)),treeCheckable: true,treeNodeFilterProp: 'label',fieldNames: { value: 'value', label: 'label', children: 'children' },},},salesLeadOwner: {render: TreeSelect,tPropty: {...OwnertProps(listEnum('companyUser')),},},businessOpportunityLeader: {render: TreeSelect,tPropty: {...OwnertProps(listEnum('companyUser')),},},accountManager: {render: TreeSelect,tPropty: {...OwnertProps(listEnum('companyUser')),},},},})}

非常灵活的表单，基于ag-table 的基础功能拖拽，自定义宽度的前提下额外拓展业务需求：自定义表头，自定义表头的sort，以及自定义搜索功能。

重点是在于思路的拓展。