pro-components
pro-components copied to clipboard
样式不兼容 ,大家怎么解决的?
用了prolayou,发现常用的搜狗浏览器不兼容很多样式,大家都这样?还是怎么解决(自己修改样式)?
padding-inline padding-block inset-inline-end inset-block-start
// 内容区域宽度
.ant-pro-page-container .ant-pro-page-container-warp-page-header~.ant-pro-grid-content.ant-pro-page-container-children-content {
margin: 6px !important;
height: '100%';
padding-inline:9px !important;
}
// 内容区域宽度 .ant-pro-page-container .ant-pro-page-container-warp-page-header~.ant-pro-grid-content.ant-pro-page-container-children-content { margin: 6px !important; height: '100%'; padding-inline:9px !important; }
好像还有好多组件都不兼容了
是不是用了 Umi4 打包的,如果是 去 umi 那边翻下文档,有解法。cssMinifier: 'cssnano'
是不是用了 Umi4 打包的,如果是 去 umi 那边翻下文档,有解法。
cssMinifier: 'cssnano'
我是用create-react-app 构建的应用,我也去看了下umi的cssMinifier配置,这只是配置css压缩的 问题是很多样式不兼容,不是配置压缩的问题,我看了下antd5官网:https://next.ant.design/components/overview-cn/ 搜狗浏览器浏览的时候全部错乱(谷歌、火狐正常),v5的组件如果都用了这些不兼容的样式话那恼火了
v5 开始好像不支持 IE11 了 https://github.com/ant-design/ant-design-pro/issues/10181#issuecomment-1256897120 https://github.com/ant-design/ant-design-pro/issues/9958#issue-1285170228
删除的功能
区块功能 删除对 IE 的支持,如果对 IE 有需求,请使用旧版本,(react,antd 都将不支持的 ie11)
v5 开始好像不支持 IE11 了 ant-design/ant-design-pro#10181 (comment) ant-design/ant-design-pro#9958 (comment)
删除的功能
区块功能 删除对 IE 的支持,如果对 IE 有需求,请使用旧版本,(react,antd 都将不支持的 ie11)
360的极速模式也不支持
太低版本的浏览器也不提供支持了, 让我们的维护成本太高了
极速浏览器最高也就 78 内核,无力吐槽
太低版本的浏览器也不提供支持了, 让我们的维护成本太高了
极速浏览器最高也就 78 内核,无力吐槽
pro-components 不能和antd一样进行进行降级处理吗。 antd的文档:https://ant-design.gitee.io/docs/react/compatible-style-cn
支持的用法相同
支持的用法相同
我看您在另一个issue进行了回复:https://github.com/ant-design/pro-components/issues/6195
你提到说_要用 ProComponents 的 ProConfigVide_请问一下,这个配置是在哪,我在文档中没有找到它的配置项
Thanks♪(・ω・)ノ
我也遇到了类似的问题,在最新版本的浏览器上显示正常,但在老版本(如83版本的chromium)上显示异常,最后通过参考https://umijs.org/docs/api/runtime-config#rootcontainerlastrootcontainer-args和https://ant.design/docs/react/compatible-style-cn基本解决。
方法就是在src/app.tsx添加下面的函数:
export function rootContainer(container) {
return (
<StyleProvider hashPriority="high" transformers={[legacyLogicalPropertiesTransformer]}>
{container}
</StyleProvider>
);
}
我也遇到這個問題了 但是依照官網的方式添加 <StyleProvider /> 後 沒有效果
ReactDOM.createRoot(document.getElementById("root")).render(
<React.StrictMode>
{/* <ConfigProvider theme={{ hashed: false }}> */}
<StyleProvider
hashPriority="high"
transformers={[legacyLogicalPropertiesTransformer]}
>
<RouterProvider router={router} />
</StyleProvider>
{/* </ConfigProvider> */}
</React.StrictMode>
)
反而是加了 <ConfigProvider theme={{ hashed: false }}> 這樣子 antd 有效果,但 antd pro-components 依舊無法支持兼容
ReactDOM.createRoot(document.getElementById("root")).render(
<React.StrictMode>
<ConfigProvider theme={{ hashed: false }}>
{/* <StyleProvider
hashPriority="high"
transformers={[legacyLogicalPropertiesTransformer]}
> */}
<RouterProvider router={router} />
{/* </StyleProvider> */}
</ConfigProvider>
</React.StrictMode>
)
使用的版本:
"@ant-design/cssinjs": "^1.16.0",
"antd": "^5.6.2",
"@ant-design/pro-components": "2.4.3",
"@ant-design/icons": "^5.1.4",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"vite": "^4.3.9"
想請問有什麼方式能讓 pro-components 和 antd 一樣能支持舊版瀏覽器嗎? 就是不要使用 :where 選擇器QQ
注意下 "@ant-design/cssinjs": "^1.16.0",
要和antd 里面的一样,不然就会不生效
我也遇到了类似的问题,在最新版本的浏览器上显示正常,但在老版本(如83版本的chromium)上显示异常,最后通过参考 https://umijs.org/docs/api/runtime-config#rootcontainerlastrootcontainer-args 和 https://ant.design/docs/react/compatible-style-cn 基本解决。
方法就是在src/app.tsx添加下面的函数:
export function rootContainer(container) { return ( <StyleProvider hashPriority="high" transformers={[legacyLogicalPropertiesTransformer]}> {container} </StyleProvider> ); }
请问一下用了您的方法确实成功了,但是message语句确实失效了,您这边遇到过这种问题吗 message.success 或者error都是不再提示了
太低版本的浏览器也不提供支持了, 让我们的维护成本太高了
极速浏览器最高也就 78 内核,无力吐槽