React MUI füllt Eigenschaften im Uhrzeigersinn

Question

Verfügt MuiBox über ausgefüllte Kurzschrifteigenschaften? für Syntax im Uhrzeigersinn?

Dies ist ungültig und führt zu einem Syntaxfehler.

<Box padding = {2 1 1 2}/>

Answer 1

直接来说，不会有这样的简写属性，padding/p属性只接受单个间距值。如果您不想使用提供的长手属性（pt、pr、pb、pl），并且由于某种原因需要将它们作为列表传递，最好的方法是提供一个函数给padding/p属性，从中Box可以派生出值（如果您不想使用sx）。例如：

<Box
  padding={(theme) => theme.spacing(2, 1, 1, 2)}
/>

可运行的CodeSandbox示例代码：: https://codesandbox.io/s/box-padding-example-r6v28m?file=/demo.tsx