I'm working on displaying a list of items in a specific format using Material-UI Grid. The desired layout is:
item1 item2
item3 item4
item5 item6
Currently, my code generates the items in a single column like this:
const display = () => {
return(
<React.Fragment>
{items.map(i => (
<Grid item xs={3} direction={'row'}>
{i}
</Grid>
))}
</React.Fragment>
)
}
return (
<Grid item xs={4} alignItems={"flex-start"}>
items:
</Grid>
<Grid item xs={8} justify={"center"} alignItems={"flex-end"} direction={"column"}>
{display()}
</Grid>
)