Question

我在react-native中使用List-view.Now，我必须在list-view的四项之后显示简单的Flat-list？如何完成这类事情？

喜欢这个：

   <View>
    <ListView>
        ...
<FlatList>
        ...
    </FlatList>
    </ListView>

</View>

Answer 1

你的意思是这样吗？

<View>
    <ListView>
        ...
    </ListView>
    <FlatList>
        ...
    </FlatList>
</View>

Answer 2

我不确定你想要实现什么，但在我看来你可以使用FlatList的ListHeaderComponent道具。

像这样的东西

<FlatList 
  ListHeaderComponent={()=> { 
    return <View>
        <ListItem1 />
        <ListItem2 />
        <ListItem3 />
      </View>}}
/>

Answer 3

由于我无法添加评论以询问您是否要呈现{3}项后面的<div class="clearfix"> <strong><?php echo t('Choose Day')?></strong> <?php if($price_dates){ foreach($price_dates->dates as $break){ ?> <div class="input"> <input type="checkbox" name="mdpID[]" value="<?=$break['mdpID']?>" <?php if($ticketID['mdpID'] == $break['mdpID']){ echo 'checked'; } ?> /> <?=date('D M jS',strtotime($break['date']))?> - £ <?=$break['price']?> </div> <?php } } ?> </div>的每个项目，ListView或想要添加额外的FlatList每隔3个项目后。所以我会尝试在这里介绍两种情况。

如果是后一种情况，您可以在每个第四个即将到来的索引中在FlatList中添加一些虚拟项目。然后在dataSource中按照以下代码段进行检查。

如果是前者，那么你可以检查一下renderRow renderRow method如下：

ListView

注意：这里<ListView dataSource={yourDataSource} renderRow={(rowData, sectionID, rowID) => { if(rowID%4 === 3){ return <FlatList .../> }else { return <YourNormalRowItem /> } }} />是因为索引从0开始，所以它会像3,7,11等。

处理React-native的List-Item

3 个答案: