Modal设置headerBg主题后不生效？

[luchanan]

trafficstars

• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Version

4.0.8

Environment

window11

Reproduction link

Steps to reproduce

<ConfigProvider :locale="getAntdLocale" :theme="themeConfig">
<AppProvider>
<RouterView />
</AppProvider>
</ConfigProvider>

const themeConfig = computed(() =>
    Object.assign(
      {
        token: {
          colorBgElevated: 'red', // 设置这个，才可以使得headerBg生效
        },
        components: {
          Modal: {
            colorText: 'red', // 生效
            headerBg: 'blue', // 单设置这个，没有效果
          },
        },
      },
      isDark.value ? darkTheme : {},
    ),
  );

简单看了下源码

const modalToken = (0, _internal.mergeToken)(token, {
modalBodyPadding: token.paddingLG,
modalHeaderBg: token.colorBgElevated,

[`${componentCls}-header`]: {
color: token.colorText,
background: token.modalHeaderBg,

取上面的token.colorBgElevated，而不是外面传进来headerBg

如果这样的话，3.x升级到4.x这个样式设置成本有点大，原以为可以把less之前设置的，放到theme，结果不是每个都可以。

现在的解决方案是：新建less文件，写样式取之前less设置过的，但是有点低效，求一个切换成本低的方法。

What is expected?

只设置headerBg能覆盖样式。像之前3.x的时候在vite.config设置'modal-header-bg': 'blue'可以覆盖样式

What is actually happening?

没有效果

[mengxianghan]

react版设置的比较精细，基本每个组件都可以单独设置，vue版不如3.x好用

[github-actions[bot]]

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days