Configure 全局化配置

为组件提供统一的全局化配置。

使用

  1. import { configure, getConfig } from 'choerodon-ui';
  2. configure({ prefixCls: 'c7n' });
  3. const prefixCls = getConfig('prefixCls');

API

参数说明类型默认值
prefixCls设置统一样式前缀stringc7n
proPrefixCls设置统一样式前缀(pro 组件)stringc7n-pro
iconfontPrefix图标样式前缀stringicon
icons图标列表,用于 IconPicker。string[] | { [categoryName: string]: string[] }import { categories } from ‘choerodon-ui-font’
ripple是否开启波纹效果booleantrue
lookupCachelookup 缓存配置。maxAge - 缓存时长 max - 缓存数量上限object{ maxAge: 1000 60 10, max: 100 }
lookupUrllookup 取值的地址或返回地址的钩子string | ((code: string) => string)code => /common/code/${code}/
lookupAxiosConfig值列表请求的配置或钩子,详见AxiosRequestConfig。 配置中默认 url 为 lookupUrl, method 为 post。AxiosRequestConfig | ({ dataSet: DataSet, record: Record, params?: any, lookupCode: string }) => AxiosRequestConfig
lovDefineUrlLov 取配置的地址或返回地址的钩子string | ((code: string) => string)code => /sys/lov/lov_define?code=${code}
lovDefineAxiosConfig返回 Lov 配置的请求的配置或钩子,详见AxiosRequestConfig。 配置中默认 url 为 lovDefineUrl, method 为 post。AxiosRequestConfig | (code: string, lovConfig?: LovConfig, { dataSet, params, data }) => AxiosRequestConfig
lovQueryUrlLov 取值的地址或返回地址的钩子string | ((code: string) => string)code => /common/lov/dataset/${code}
lovQueryAxiosConfigLov 查询数据请求的配置或钩子,详见AxiosRequestConfig。 配置中默认 url 为 lovQueryUrl, method 为 post。AxiosRequestConfig | (code: string, lovConfig?: LovConfig, { dataSet, params, data }) => AxiosRequestConfig
lovTriggerModeLov 触发弹窗模式,可选 icon,input。stringicon
lovTableProps全局配置 lov 的 tableProps,当同时存在 lovTableProps 以及的时候会进行一层合并TableProps{}
lovModalPropsLov 弹窗属性,详见ModalPropsModalProps
lookupBatchAxiosConfig返回 lookup 批量查询配置的钩子,详见AxiosRequestConfig(codes: string[]) => AxiosRequestConfig
selectReverse是否开启下拉多选反向功能。booleantrue
axios替换内置的 axios 实例AxiosInstance
dataKey默认 DataSet 的 dataKeystringrows
totalKey默认 DataSet 的 totalKeystringtotal
statusKey默认 DataSet 提交的数据中标识状态的 keystringstatus
tlsKey默认 DataSet 数据中标识多语言的 keystringtls
status默认 DataSet 提交的数据的状态映射{ add: string, update: string, delete: string }{ add: ‘add’, update: ‘update’, delete: ‘delete’ }
labelLayout默认 Form 的 labelLayoutstringhorizontal
queryBar默认 Table 的 queryBarstringnormal
tableBorder默认 Table 的 borderbooleantrue
tableHighLightRow默认 Table 当前行高亮booleantrue
tableSelectedHighLightRow默认 Table 当前勾选行高亮booleanfalse
tableRowHeight默认 Table 行高auto | number30
tableColumnResizable默认 Table 列可调整列宽booleantrue
tableExpandIcon默认 Table 自定义展开图标({ prefixCls, expanded, expandable, needIndentSpaced, record, onExpand }) => ReactNode
tableSpinProps默认 Table spin 的属性SpinProps{ size: Size.default, wrapperClassName: ‘’ }
tableButtonProps默认 TableButton 的属性ButtonProps{ color: ‘primary’, funcType: ‘flat’ }
tableCommandProps默认 TableCommand 的属性ButtonProps{ color: ‘primary’, funcType: ‘flat’ }
tableDefaultRenderer默认 Table 为空时 renderer 的内容ReactNode‘’
tableAlwaysShowRowBoxTable 是否一直显示 rowbox,开启后在其他模式下也会显示 rowboxbooleanfalse
tableUseMouseBatchChooseTable 是否使用鼠标批量选择,开启后在 rowbox 的情况下可以进行鼠标拖动批量选择,在起始的 rowbox 处按下,在结束位置松开booleanfalse
tableAutoFocusTable 新增行自动聚焦至第一个可编辑字段booleanfalse
tableKeyboardTable 开启或关闭新增的快捷按钮事件booleanfalse
tableFilterAdapterTable 筛选条请求适配器AxiosRequestConfig
tableFilterSuffixTable 筛选条按钮预留区ReactNode
tableFilterSearchTextTable 筛选条快速搜索参数名stringparams
tableAutoHeightDiffTable 自动高度误差值配置number80
pagination默认 pagination 的属性TablePaginationConfig | false详见Pagination
dropdownMatchSelectWidth默认下拉框匹配输入框宽度booleantrue
modalSectionBorder默认 Modal 的头和脚有边框线booleantrue
modalOkFirst默认 Modal 的 ok 按钮排在第一个booleantrue
modalKeyboardModal 是否支持键盘 esc 关闭booleantrue
modalAutoCenterModal 是否默认居中booleanfalse
drawerOkFirst默认 Modal drawer 的 ok 按钮排在第一个,优先级高于 modalOkFirstboolean | undefinedundefined
buttonFuncType默认 Button 的功能类型stringraised
buttonColor默认 Button 的颜色stringdefault
renderEmpty自定义组件空状态。componentName会接收到的值为 Table Select,在实现函数的时候需要对这两个输入进行处理,注意需要同时处理Table以及Select,默认值参考源代码的defaultRenderEmpty(componentName: string) => ReactNode
defaultValidationMessages自定义校验信息, 详见ValidationMessagesValitionMessages
generatePageQuery分页参数转换的钩子({ page?: number, pageSize?: number, sortName?: string, sortOrder?: string }) => object
feedbackDataSet 查询和提交数据的反馈配置, 详见FeedbackFeedback
transportDataSet 默认 transport, 详见TransportTransport
formatter日期格式化。其中 jsonDate 是数据请求和响应时的格式,为空时日期会转化为 timestamp。详见FormatterFormatter
useColonForm 中是否使用冒号,当开启时会在所有的 label 后面加上冒号,并且必填的*号会被移到最前方booleanfalse
excludeUseColonTagListForm 中不使用冒号的标签的列表,当为自定义组件的时候,需要设置 displayName 作为标签名string[][‘div’,’button’,’Button’]
collapseExpandIconPosition全局配置 collapse 图标位置left | rightleft
collapseExpandIcon全局配置 collapse 自定义切换图标(panelProps) => ReactNode | text(预置icon + 展开收起文字)
collapseTrigger全局配置切换面板的触发位置header | iconheader
textFieldAutoComplete全局配置textField的autoComplete属性可选值: on off
resultStatusRenderer自定义状态展示,可以覆盖现有状态展示,也可以增加状态展示,支持全局配置object -> {string:react.ReactNode}
numberFieldNonStrictStep全局配置 NumberField 的 nonStrictStep 属性booleanfalse
numberFieldFormatterNumberField格式器FormatNumberFunc: (value: string, lang: string, options: Intl.NumberFormatOptions) => string
numberFieldFormatterOptionsNumberField格式器参数,可以与组件值进行合并FormatNumberFuncOptions: { lang?: string, options?: Intl.NumberFormatOptions }
exportMode导出模式选择:前端导出,后端导出client | serverclient

Formatter

属性默认值类型
jsonDateYYYY-MM-DD HH:mm:ssstring
dateYYYY-MM-DDstring
dateTimeYYYY-MM-DD HH:mm:ssstring
timeHH:mm:ssstring
weekYYYY-Wostring
monthYYYY-MMstring
yearYYYYstring

ValidationMessages

属性默认值类型
badInput请输入一个数字。ReactNode
patternMismatch请输入有效的值。ReactNode
rangeOverflow{label}必须小于或等于{max}。ReactNode
rangeUnderflow{label}必须大于或等于{min}。ReactNode
stepMismatch请输入有效值。最接近的有效值为{0}。ReactNode
stepMismatchBetween请输入有效值。两个最接近的有效值分别为{0}和{1}。ReactNode
tooLong请将该内容减少到{maxLength}个或更少字符(目前您使用了{length}个字符)。ReactNode
tooShort请将该内容增加到{minLength}个或更多字符(目前您使用了{length}个字符)。ReactNode
typeMismatch请输入与类型匹配的有效值。ReactNode
valueMissing请输入{label}。ReactNode
valueMissingNoLabel请填写此字段。ReactNode
uniqueError该字段值重复,请重新填写。ReactNode
unknown未知错误。ReactNode

AxiosRequestConfig

属性说明类型
url地址string
method方法string
baseURL基础地址string
headers请求头object
paramsurl 参数object
data请求体数据object
timeout请求超时时间number
withCredentials用于跨域传递 cookieboolean
transformRequest转变提交的数据(data: any, headers: any) => string
transformResponse转变响应的数据(data: any, headers: any) => any

更多配置请参考 Axios 官方文档,或参考 typescript 文件/node_modules/axios/index.d.ts