React MUI顺时针填充属性

Question

MuiBox是否具有任何填充的简写属性？用于顺时针语法？

这种写法是无效的，并会导致语法错误。

<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