如何在React中使用MaterialUI制作全宽网格项？

Question

如何使网格项的大小占据整个宽度？我在材料ui文档中找不到它。

<Grid container>
   <Grid item md={12} lg={12} spacing={0}>
      <Header/>
   </Grid>
   <Grid item md={12} lg={12}>
      <Footer styles={styles.Paper}/>
   </Grid>
</Grid>

此处包含页脚的网格没有占据整个宽度，请参见上图。

Answer 1

您可以将间距属性与网格容器

一起使用

<Grid container spacing={40}>
    <Grid item xs={12} style={{paddingLeft: 0, paddingRight: 0}}>
      <Paper className={classes.paper}>xs=12</Paper>
    </Grid>
    <Grid item xs={12} sm={6}>
      <Paper className={classes.paper}>xs=12 sm=6</Paper>
    </Grid>
    <Grid item xs={12} sm={6}>
      <Paper className={classes.paper}>xs=12 sm=6</Paper>
    </Grid>
  </Grid>

它对我有用。