javascript - react : how to get Material UI's grid spacing to work?

Question

我正在使用 Material UI 的网格 (https://material-ui.com/api/grid) 进行布局，但是当列和行工作正常时，spacing属性似乎不起作用。

我已经这样导入了 Grid:import Grid from '@material-ui/core/Grid'

  <Grid container spacing={10}>
    <Grid item xs={12} sm={6}>
      CONTENT
    </Grid>
    <Grid item xs={12} sm={6}>
      CONTENT
    </Grid>
  </Grid>

但没有出现填充。

有谁知道我可以在网格中包含间距吗？

Answer 1

对我来说，问题是我没有将元素用于网格元素。

<Grid container spacing={3}>
    <Grid item xs={12}></Grid>
    <Grid item xs={12}></Grid>
</Grid>