🐛 [BUG] 菜单不会跟随colorPrimary或者primaryColor颜色改变，永远都是黑色

taofeifanIT commented 9 months ago

🐛 bug 描述

📷 复现步骤 | Recurrence steps

菜单不会跟随colorPrimary或者primaryColor颜色改变，永远都是黑色，用户体验上很不方便，不知道当前在哪个菜单下

🏞 期望结果 | Expected results

💻 复现代码 | Recurrence code

const Settings: ProLayoutProps & { pwa?: boolean; logo?: string; } = { navTheme: 'light', // 拂晓蓝 colorPrimary: "#13C2C2", // primaryColor: "#13C2C2", layout: 'top', contentWidth: 'Fixed', fixedHeader: false, fixSiderbar: true, colorWeak: false, title: 'test', pwa: false, logo: '/icons/logo-105x115.png', iconfontUrl: '', // menu: { // locale: false, // }, token: { // 参见ts声明，demo 见文档，通过token 修改样式 //https://procomponents.ant.design/components/layout#%E9%80%9A%E8%BF%87-token-%E4%BF%AE%E6%94%B9%E6%A0%B7%E5%BC%8F }, splitMenus: false, };

export default Settings;

© 版本信息

Ant Design Pro 版本: [6.0.0]
umi max 版本
浏览器环境
开发环境 [e.g. mac OS]

🚑 其他信息

ahKevinXy commented 9 months ago

同问，好像这个版本 navTheme 这个不支持

chenshuai2144 commented 8 months ago

这个问题出现在 Ant Design Pro 的菜单颜色不能跟随 colorPrimary 或 primaryColor 的设置而改变，而是一直是黑色。这给用户的体验带来了不便，因为他们无法知道当前在哪个菜单下。

根据提供的代码，我看到你将 colorPrimary 设置为了 #13C2C2，但是菜单的颜色没有改变。这可能是因为 Ant Design Pro 的菜单颜色和主题设置是分开的。

要改变菜单颜色，你可以使用 pro.ant.design 的自定义样式，具体做法是将 colorPrimary 的颜色值赋给 @primary-color，然后在项目的全局样式文件中添加以下代码：

@import '~antd/dist/antd.less';

@primary-color: #13C2C2;

// 其他自定义样式

这样就能够将菜单的颜色与 colorPrimary 的设置同步了。

另外，你可以参考 Ant Design Pro 的文档中关于使用 token 修改样式的部分，通过使用 token 来修改菜单的样式。文档链接：https://procomponents.ant.design/components/layout#%E9%80%9A%E8%BF%87-token-%E4%BF%AE%E6%94%B9%E6%A0%B7%E5%BC%8F

希望这个解答能够帮到你！如果还有其他问题，请随时提问。

chenshuai2144 commented 8 months ago

如果有条件升级成 antd@v5 好了，v5 解决起来非常简单

ant-design / ant-design-pro