나는 그놈 반동 라이브러리를 사용하고 있습니다. 나는 전화 레이아웃 프로젝트에서 일하고있다.그로밋에서 기둥 레이아웃을 만드는 방법
저는 요소 배열을 나타내는 redux 상태의 지주를했습니다. 초기 상태는 서버가 반환 한 후, 소품은 내가 원하는 것은 각 열은 사용 가능한 공간의 50 %를 얻을 수 행에 의해 정확히 두 개의 열이있는 열 레이아웃입니다
[{ country: 'England' }, { country: 'Germany' }, { country: 'Spain' }, { country: 'Zimbawe' }]
것, 하늘의 배열입니다.
내가 이런 식으로<Columns responsive={false}>
{this.props.countries.map(this.renderCountries)}
</Columns>
그리고 마지막으로 renderCountries 방법
renderCountries (country) {
return <Box key={country.country}>{country.country}</Box>
}
에서 열 구성 요소를 사용했습니다하지만이 코드로 시스템이 행에 의해 하나의 요소를 렌더링 이렇게하려면. 행별로 두 개의 열을 얻으려면 어떻게해야합니까? Grommet Docs for Columns 레이아웃에 따라 미리
이 도움말은 최소 열 수를 사용합니다. 모바일에서 작업하기 때문에 Column 구성 요소는 항상 행당 하나의 열만 표시합니다. 그래서 당신의 대답은 전혀 도움이되지 않습니다. – user2540463
문서에 표시된 것과 같이 상자의 크기를 설정하려고 했습니까? – bennygenel
예. 열 너비는 줄어들지 만 행당 하나씩 유지됩니다. 데이터가 비어있을 때 masonry = {true}를 설정하면 데이터가 비어있는 경우 오류가 발생합니다. 정의되지 않은 'childNodes'속성을 읽을 수 없습니다 – user2540463