Antd 弹窗用方法调用后没有动画且无法关闭
const modal = Modal.info({
content: <Table columns={columns} size="small" bordered dataSource={fields} pagination={false} />,
prefixCls: 'xxxxx-modal',
okText: '确定',
okType: 'primary',
maskClosable: true,
icon: null,
centered: true,
onOk() {
modal.destroy();
},
});
如果遇到类似上述代码打开弹窗后无法关闭,这是由于定制 antd 的时候配置了 prefixCls 属性,用方法调用弹窗时弹窗不会渲染在
antd 的 ConfigProvider 组件中,以至于找不到 context 信息
<ConfigProvider
locale={zh_CN}
prefixCls="xxxxx"
input={{ autoComplete: 'off' }}
dropdownMatchSelectWidth={false}
getPopupContainer={getPopupContainer}
form={{ colon: false }}
>
{children}
</ConfigProvider>
此时需要配置:
ConfigProvider.config({ prefixCls: 'xxxxx' });
如果遇到 message 等类似的方法调用异常可设置:
message.config({
prefixCls: 'xxxxx-message',
});
标签:动画,prefixCls,modal,Antd,message,xxxxx,弹窗
From: https://www.cnblogs.com/idiv/p/17040585.html