🐛[BUG] pro-layout 的 logo 在 mobile 模式下会多渲染一层 a 标签,导致在自定义 logo 跳转的时候会有warning
Mankvis opened this issue · comments
提问前先看看:
https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md
🐛 bug 描述
在使用 umi 和 pro-components 布局的时候,在设置 menuHeaderRender 出现问题,如果返回 a 标签则会出现警告
validateDOMNesting(...): cannot appear as a descendant of .
如果不加 a 标签样式又出问题
![image](https://private-user-images.githubusercontent.com/49258868/339734526-97c1091c-b429-4bbd-b97a-fdbb137975f2.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjE2NTAwNjIsIm5iZiI6MTcyMTY0OTc2MiwicGF0aCI6Ii80OTI1ODg2OC8zMzk3MzQ1MjYtOTdjMTA5MWMtYjQyOS00YmJkLWI5N2EtZmRiYjEzNzk3NWYyLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MjIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzIyVDEyMDI0MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTk3N2U5ZTA2MGQxYzJmYTVhMDA4OTE1OTk5MjU1NTBjN2U5MTA4MWM5N2I2MGNiNzUzOTBiYzVjNjhkYTkyOTYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.gTN0N_3rVElBHRiyET1cesSQPUP16juVThSGe8MCAy4)
![image](https://private-user-images.githubusercontent.com/49258868/339734559-c28dce3c-acce-47cc-a99a-6d74977fe692.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjE2NTAwNjIsIm5iZiI6MTcyMTY0OTc2MiwicGF0aCI6Ii80OTI1ODg2OC8zMzk3MzQ1NTktYzI4ZGNlM2MtYWNjZS00N2NjLWE5OWEtNmQ3NDk3N2ZlNjkyLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MjIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzIyVDEyMDI0MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWE3MjliYTgzYjUzMTM4MjZhZTFhZTZjYzUxMGUzNjY0ZTc1MzcyNDExODk3MzI5MGNlNDg3ZGNmNWNlYjVhNjUmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.O7-W0aJnXzPRb70mP-yYKyfsu0IULrlusQDsb82lXQk)
![image](https://private-user-images.githubusercontent.com/49258868/339734613-4925b05e-1d7f-4640-8305-d5dd61f6e06e.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjE2NTAwNjIsIm5iZiI6MTcyMTY0OTc2MiwicGF0aCI6Ii80OTI1ODg2OC8zMzk3MzQ2MTMtNDkyNWIwNWUtMWQ3Zi00NjQwLTgzMDUtZDVkZDYxZjZlMDZlLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MjIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzIyVDEyMDI0MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPThiY2YyMjJmNDI5NDM3YjQwNjkzMTc2YzQ5Y2JiYmY4MjZmMGY5NzJiZWI1YjFiMDE5ZGYzNmU4NTJkYzM3NDAmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.YBN8YSUvLblR1fgVHGE6If5CWqYHW6WQ8xGrDNSSpxw)
![image](https://private-user-images.githubusercontent.com/49258868/339734642-97f83432-0efe-46b0-a2ca-00394958a245.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjE2NTAwNjIsIm5iZiI6MTcyMTY0OTc2MiwicGF0aCI6Ii80OTI1ODg2OC8zMzk3MzQ2NDItOTdmODM0MzItMGVmZS00NmIwLWEyY2EtMDAzOTQ5NThhMjQ1LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MjIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzIyVDEyMDI0MlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWVmNTQxNDE1ZmVkOTAxOTQxMzRjNWZmNmViMWZmMWI5ZTNlMTVmMGRjMmM5YTExZGQ1ODNjMjBmNjk3YzAyZjImWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.8ff2SVGHYRDlG5xfZmxnjz4svRaqMm719VdFZvN4p2k)
📷 复现步骤
menuHeaderRender={(logo, title) => ( <> <a> {logo} {title} </a> </> )}
🏞 期望结果
💻 复现代码
© 版本信息
- ProComponents 版本: "@ant-design/pro-components": "^2.7.10",
- umi 版本 "^4.2.10"
- 浏览器环境 chrome
- 开发环境 mac OS
🚑 其他信息
{
"private": true,
"author": "",
"scripts": {
"dev": "umi dev",
"build": "umi build",
"postinstall": "umi setup",
"setup": "umi setup",
"start": "npm run dev"
},
"dependencies": {
"@ant-design/pro-components": "^2.7.10",
"@emotion/css": "^11.11.2",
"@emotion/react": "^11.11.4",
"@emotion/styled": "^11.11.5",
"antd": "^5.18.1",
"umi": "^4.2.10"
},
"devDependencies": {
"@types/react": "^18.0.33",
"@types/react-dom": "^18.0.11",
"@umijs/plugins": "^4.2.11",
"typescript": "^5.0.3"
}
}