Question

我需要帮助，因为我失去了主意哈哈...

我有一个主数组products（只是一个示例）：

[
    {
        "from": "country",
        "maker": "name of maker",
        "id": "1969",
        "image": "image.jpg",
        "label": "355",
        "name": "name of product",
        "price": "12.90",
        "subscriber_price": "8.90",
        "url_path": "url",
        "occasion": null,
        "colour": "31",
        "origin": "397",
    },
    {
        "from": "country",
        "maker": "name of maker",
        "id": "2043",
        "image": "image.jpg",
        "label": "362",
        "name": "name of product",
        "price": "24.90",
        "subscriber_price": "24.90",
        "url_path": "url",
        "occasion": "51,376,155,39",
        "colour": "31",
        "origin": "395"
    }
]

我正在使用此选择器组件。所以，我正在做的是：我有一个选择器来选择带有“颜色”的产品。然后，我有另一个选择器来过滤带有“来源”的所选产品（例如，仅带有颜色：31），最后我要通过“标签”过滤它们...

事实是我有3个选择器，有3个函数可以选择它们，并且可以正常工作，但问题是我正在用setState擦除“ displayProducts”的渲染。因此，选择了3个选项后，我将无法返回。.

例如，我选择“ colour：31”和“ origin：397”和“ label：355” ..我不能回去告诉：最后我想要“ origin：395”，因为它不存在等等，而一种“颜色”可以具有不同的“标签，原产地...”

我正在执行类似的操作，但是它仅适用于一个选项，不能用于多个选项，并且没有保留解决方案来再次查找经过过滤的产品：

onChangeGetOrigin(originValue) {
    this.setState(() => ({
        activeOrigin: originValue,
        displayProducts: this.state.displayProducts.filter(product => product.origin == originValue)
    }));
}

有人能理解我在说什么吗？ :-D

Answer 1

您可以维护两个阵列。一个包含产品的完整列表，另一个包含应用过滤器后的派生数组。您可以使用派生列表进行显示，并使用原始数组进行选择。

始终将所选数据保留在新阵列（React Native）中

1 个答案: