样式反应原生平面列表

问题描述

我正在尝试将FlatList项放在列表的HeaderComponent旁边。我希望房间从Create房间旁边开始。下面是它的外观图片[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,
  }

推荐答案

我认为这是不可能的，除非您作弊。

我的意思是这样的：

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} />
         />