fix: ConfigProvider with nest prefixCls (#23423)

* fix: ConfigProvider with nest prefixCls

* update

* update

* update
This commit is contained in:
二货机器人 2020-04-21 11:16:33 +08:00 committed by GitHub
parent 3d76859bbc
commit 5a10d29796
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 6 deletions

View File

@ -42,4 +42,16 @@ describe('ConfigProvider', () => {
expect(wrapper.text()).toContain('empty placeholder'); expect(wrapper.text()).toContain('empty placeholder');
}); });
it('nest prefixCls', () => {
const wrapper = mount(
<ConfigProvider prefixCls="bamboo">
<ConfigProvider>
<Button />
</ConfigProvider>
</ConfigProvider>,
);
expect(wrapper.find('button').props().className).toEqual('bamboo-btn');
});
}); });

View File

@ -29,7 +29,7 @@ export const ConfigContext = React.createContext<ConfigConsumerProps>({
getPrefixCls: (suffixCls: string, customizePrefixCls?: string) => { getPrefixCls: (suffixCls: string, customizePrefixCls?: string) => {
if (customizePrefixCls) return customizePrefixCls; if (customizePrefixCls) return customizePrefixCls;
return `ant-${suffixCls}`; return suffixCls ? `ant-${suffixCls}` : 'ant';
}, },
renderEmpty: defaultRenderEmpty, renderEmpty: defaultRenderEmpty,

View File

@ -45,12 +45,16 @@ export interface ConfigProviderProps {
} }
class ConfigProvider extends React.Component<ConfigProviderProps> { class ConfigProvider extends React.Component<ConfigProviderProps> {
getPrefixCls = (suffixCls: string, customizePrefixCls?: string) => { getPrefixClsWrapper = (context: ConfigConsumerProps) => {
const { prefixCls = 'ant' } = this.props; return (suffixCls: string, customizePrefixCls?: string) => {
const { prefixCls } = this.props;
if (customizePrefixCls) return customizePrefixCls; if (customizePrefixCls) return customizePrefixCls;
return suffixCls ? `${prefixCls}-${suffixCls}` : prefixCls; const mergedPrefixCls = prefixCls || context.getPrefixCls('');
return suffixCls ? `${mergedPrefixCls}-${suffixCls}` : mergedPrefixCls;
};
}; };
renderProvider = (context: ConfigConsumerProps, legacyLocale: Locale) => { renderProvider = (context: ConfigConsumerProps, legacyLocale: Locale) => {
@ -70,7 +74,7 @@ class ConfigProvider extends React.Component<ConfigProviderProps> {
const config: ConfigConsumerProps = { const config: ConfigConsumerProps = {
...context, ...context,
getPrefixCls: this.getPrefixCls, getPrefixCls: this.getPrefixClsWrapper(context),
csp, csp,
autoInsertSpaceInButton, autoInsertSpaceInButton,
locale: locale || legacyLocale, locale: locale || legacyLocale,