材质ui网格将内容方向更改为行答案

【问题标题】：Material ui grid change content direction to row材质ui网格将内容方向更改为行
【发布时间】：2021-08-31 08:59:16
【问题描述】：

我是材料 ui 的新手，我创建了一个包含 2 个组件、一个自动完成和一个按钮的网格。这两个显示在另一个下方，所以我想将它们排列成一行。这是我的代码的样子：

<Grid item sm={4} xs={12} direction="row"><Autocomplete/><button/><Grid>

我尝试了 direction="row" 但它不起作用。非常感谢您的帮助

【问题讨论】：

请同时添加您的子组件的代码实现，以便我们轻松提供帮助。
对不起，我没听懂？我有一个网格容器，里面有多个网格，这个网格是其中一个包含一个按钮和一个自动完成，它们显示在另一个之上，我想让它们并排

标签： javascript reactjs material-ui

【解决方案1】：

我建议您使用与技术documentation 示例相同的网格系统，如下所示，

export default function BasicGrid() {
  return (
    <Grid container spacing={2}>
      <Grid item xs={8}>
        <Item>Autocomplete Here</Item>
      </Grid>
      <Grid item xs={4}>
        <Item>Button Here</Item>
      </Grid>
    </Grid>
  );
}

Here is working sandbox example.

【讨论】：

我的间距有问题，没有，我该如何解决？