Javascript 当其余的应该是MaterialUI网格中的列时，如何将两个项作为行放在一列中？

我想把我的箭放在一个在上面，另一个在下面的地方。如何在MaterialUI网格中实现这一点

下面我附上了一张我现在拥有的和我想要达到的目标的照片

我的代码：

<Paper className={classes.paper}>
      
    <Grid container spacing={2}>
      <!-- here -->
      <Grid item>
        <ButtonBase className={classes.image}>
            <ArrowUpwardIcon/>
        </ButtonBase>
      </Grid>
      <Grid item>
        <ButtonBase className={classes.image}>
            <ArrowDownwardIcon/>
        </ButtonBase>
      </Grid>
     <!-- end-->
      <Grid item>
        <ButtonBase className={classes.image}>
          <img className={classes.img} alt="complex" src="https://amadeuscontenthub.pl/wp-content/uploads/2019/08/Silhouette-of-an-airplane-just-after-take-off-during-sunset-640x377.jpg" />
        </ButtonBase>
      </Grid>
      <Grid item xs={12} sm container>
        <Grid item xs container direction="column" spacing={2}>
          <Grid item xs>
            <Typography gutterBottom variant="subtitle1">
                {ArticlePreview.title}
            </Typography>
            <Typography variant="body2" gutterBottom>
                {ArticlePreview.description}
            </Typography>
          </Grid>
          <Grid item>
            <Typography variant="body2" style={{ cursor: 'pointer' }}>
                <MessageIcon/> 2137 comments
            </Typography>
          </Grid>
        </Grid>
      </Grid>
    </Grid>
  </Paper>

试试这个

    <Grid container item direction="column">
        <ButtonBase className={classes.image}>
            <ArrowUpwardIcon/>
        </ButtonBase>
        <ButtonBase className={classes.image}>
            <ArrowUpwardIcon/>
        </ButtonBase>
    </Grid>

解决此问题的一个简单方法是在主父网格容器内创建另一个
网格
容器。然后在新容器中，将这两个图标作为网格项

{/* <!-- here --> */}
<Grid item style={{ alignSelf: "center" }}>
  <Grid container direction="column">
    <Grid item>
      <ButtonBase className={classes.image}>
        <ArrowUpward />
      </ButtonBase>
    </Grid>
    <Grid item>
      <ButtonBase className={classes.image}>
        <ArrowDownward />
      </ButtonBase>
    </Grid>
  </Grid>
</Grid>
{/* <!-- end--> */} 

{/**/}
这就是：非常感谢，它很有效。