MUI 中的框与堆栈
Box vs Stack in MUI
我最近开始在我的 React 项目中使用 MUI。我对两个布局组件感到困惑，即 Stack 和 Box
什么时候应该使用 Stack over Box？
我知道
但是我不确定什么时候使用 Stack 组件，它们之间有什么区别？
Box: Box 组件用作大多数 CSS 实用程序需求的包装器组件。
Box 组件将 @mui/system.
中暴露的所有 style functions 打包
Stack: Stack 就像一个灵活的容器。 Stack 组件管理直接 children 沿垂直或水平轴的布局，每个 child.
之间有可选的间距 and/or 分隔符
栈的使用：
Stack 与 one-dimensional 布局有关，而 Grid 处理 two-dimensional 布局。默认方向是垂直堆叠 children 的列。
默认情况下，Stack 将项目垂直排列在一列中。但是，direction 属性也可用于水平放置项目。
使用 divider 属性在每个 child 之间插入一个元素。这与 Divider 组件配合使用效果特别好。
您可以根据活动断点切换方向或间距值。
我最近开始在我的 React 项目中使用 MUI。我对两个布局组件感到困惑，即 Stack 和 Box
什么时候应该使用 Stack over Box？
我知道
但是我不确定什么时候使用 Stack 组件，它们之间有什么区别？
Box: Box 组件用作大多数 CSS 实用程序需求的包装器组件。
Box 组件将 @mui/system.
Stack: Stack 就像一个灵活的容器。 Stack 组件管理直接 children 沿垂直或水平轴的布局，每个 child.
之间有可选的间距 and/or 分隔符栈的使用：
Stack 与 one-dimensional 布局有关，而 Grid 处理 two-dimensional 布局。默认方向是垂直堆叠 children 的列。
默认情况下，Stack 将项目垂直排列在一列中。但是，direction 属性也可用于水平放置项目。
使用 divider 属性在每个 child 之间插入一个元素。这与 Divider 组件配合使用效果特别好。
您可以根据活动断点切换方向或间距值。