Стилизация React Native FlatList - PullRequest
Новая
       33

Стилизация React Native FlatList

0 голосов
/ 11 июля 2020

Я пытаюсь получить элементы FlatList рядом с HeaderComponent списка. Я хочу, чтобы комнаты начинались рядом с комнатой создания. Вот изображение того, как это выглядит [1]: https://i.stack.imgur.com/qyZZP.png

Вот код для списка комнат: 

<FlatList
   ListHeaderComponent={<Room create />}
   numColumns={2}
   data={this.props.rooms}
   keyExtractor={(room) => room._id}
   renderItem={(itemData) => <Room room={itemData.item} create={false}/>
/>

Вот стиль карточки номера: 

cardStyle: {
    backgroundColor: "white",
    borderRadius: 10,
    width: Dimensions.get("window").width / 2.6,
    height: Dimensions.get("window").width / 2.6,
    padding: 10,
    margin: 10,
  }

1 Ответ

0 голосов
/ 11 июля 2020

Я не думаю, что это возможно, если вы не "обманываете".

Я имею в виду примерно следующее: 

const rooms = this.props.rooms;
rooms.unshift({});
...
...

        <FlatList
            numColumns={2}
            data={rooms}
            keyExtractor={(room) => room._id}
            renderItem={(itemData) => itemData.index === 0 ? <Room create /> : <Room room={itemData.item} create={false}/> 
            room={itemData.item} create={false} />
         />
...