尽管尝试了不同的方法，但简单网格无法正常工作 Chakra-ui

Question

我的简单网格不工作我想让项目在一条直线上，但项目是水平的

我的代码 请注意，将宽度应用于简单网格也会呈现相同的效果，因此无论我是否对其应用 W

                        <SimpleGrid w={"90vw"} column={2} spacing={10}>
                            {result.data.map((e) => {

                                return (
                                    <Box w={"20vw"} key={e.id}>

                                        < Item title={e.title.slice(0, 25) + "..."} src={e.images.original.mp4} />
                                    </Box>

                                )

                            })}
                        </SimpleGrid>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

Answer 1

你犯了一个拼写错误。它是columns而不是column

<SimpleGrid w={"90vw"} columns={2} spacing={10}>
   {result.data.map((e) => {
      return (
        <Box w={"20vw"} key={e.id}>
           <Item title={e.title.slice(0, 25) + "..."} src={e.images.original.mp4} />
        </Box>

       )

    })}
</SimpleGrid>