material-ui [系统] 背景颜色不能直接作为属性在Box上使用,

h6my8fg2  于 2个月前  发布在  其他
关注(0)|答案(7)|浏览(30)

重复问题

  • 我搜索了现有的问题

最新版本

  • 我测试了最新版本

重现步骤 🕹

链接到实时示例: https://codesandbox.io/s/vigorous-chatterjee-w1nhkz?file=/demo.tsx
在上面的沙盒中, backgroundColor 可以工作,但 TypeScript 抱怨它不受支持。

当前行为 😯

TypeScript 抱怨属性不可用,即使它可以工作。

预期行为 🤔

输入应该只是工作。

上下文 🔦

  • 无响应*

你的环境 🌎

npx @mui/envinfo

@mui/material: 5.11.12 // latest of all packages
b1uwtaje

b1uwtaje1#

以下是可以直接在组件上使用的系统属性列表:

https://mui.com/system/properties/

它不包括 backgroundColor 。请使用 sx 属性来设置此属性。

iqxoj9l9

iqxoj9l92#

@hbjORbj 太棒了,谢谢!但是打字应该也反映出相同的情况吧?

o4tp2gmn

o4tp2gmn3#

但是打字也应该反映出相同的情况吧?
打字反映出相同的情况,这不就是你在使用backgroundColor时收到TS投诉的原因吗?

1cklez4t

1cklez4t4#

对不起,我的意思是另一种方式。我想问的是为什么TS说它不能工作,但实际上它可以工作。

ozxc1zmp

ozxc1zmp5#

我的失误。实际上,background-color也应该被支持。文档中写道
请注意,此表仅列出自定义属性,所有其他常规CSS属性和选择器都受支持。
我猜想bgcolor满足类型要求。
material-ui/packages/mui-system/src/styleFunctionSx/AliasesCSSProperties.d.ts
第15行的aff4ec6
| | bgcolor?: StandardCSSProperties['backgroundColor']; |
这里有一个可用的Codesandbox: https://codesandbox.io/s/green-sunset-egmmdq
感谢你的报告。我需要让其他团队成员更好地理解,但我认为bgcolor被使用,而不是backgroundColor,以便在系统属性和CSS属性之间做出一些区分。

fdx2calv

fdx2calv6#

感谢查看此问题。您是否找到了整个列表中,为什么只有背景颜色(background-color)变成了bgColor,而其他属性没有发生这种情况?

xmd2e60i

xmd2e60i7#

这个真的很方便。谢谢。🙌

相关问题