如何正确应用Material-UI Box组件的spacing间距属性？

给组件添加外边距与间距的实现难度很低，Material-UI提供了对应的快捷能力，无需为每个组件单独编写CSS样式。

如下方代码所示，如果不指定px单位，margin将无法正常生效

<Box display="flex" alignItems="center" marginRight={`${theme.spacing(25)}px`}>...</Box>

更推荐的方案是直接交由MUI处理样式，充分利用框架本身的能力，无需自行编写CSS类来实现对应样式。

无需字符串拼接的写法会更便捷：

<Box display="flex" alignItems="center" marginRight={theme.spacing(25)}>...</Box>

内容的提问来源于stack exchange，提问作者fetahokey