如何从FlatList中选择项目？ [英] How to select item(s) out of a FlatList?

问题描述

我想使用FlatList选择项目，就像在照片画廊上选择多张照片一样（在这种情况下，我使用的是2行的平面列表，如2x10的网格）。我想使用onLongPress选择（例如）3个项目。

I want to select items using FlatList like when you select multiple photos on your photo galery (in this case, I am using a flatlist with 2 rows like a grid of 2x10). I want to select (for example) 3 items using onLongPress.

这样的东西，但有2行。

Something like this, but with 2 rows.

推荐答案

这是怎么回事：

每件呈现的商品都有 onLongPress ， isPicked 财产。

Every item rendered would have an onLongPress, and an isPicked property.

最初，在 renderItem（）中，您将实现一个呈现每次执行一个项目时，选中square 或空方;指示是否选择了项目（基于 isPicked ）。

Initially, and in renderItem(), you would implement an if statement that either renders checked square or empty square every time an item executes executes; To indicate if the item is selected or not (based on isPicked).

onLongPress 调用 isPicked 并重新呈现所有内容（切换到广场）。因此，如果 isPicked 为true，则变为false，如果false变为true。你可以通过简单地做到这一点： this.item.isPicked =！this.item.isPicked

onLongPress invokes isPicked and rerenders everything (to toggle the square). So if isPicked is true it becomes false, and if false becomes true. You can achieve that by simply doing this: this.item.isPicked = !this.item.isPicked

最后在提交上，按 isPicked === true 过滤所有初始项目（数据），并结束，你将结束选择的项目！

Finally on Submit, filter all your initial items (data) by the isPicked === true and hurrah, you will end up with the items that were selected !

这篇关于如何从FlatList中选择项目？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！