始终将所选数据保留在新数组中（React Native）答案

【问题标题】：Always keep selected data in new Array (React Native)始终将所选数据保留在新数组中（React Native）
【发布时间】：2018-09-06 17:11:31
【问题描述】：

我需要帮助，因为我疯了哈哈......

我有一个主数组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"
    }
]

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

事实是我有 3 个选择器，3 个函数来选择它们并且它正在工作，但问题是我正在使用 setState 擦除我的“displayProducts”渲染。所以，当我选择了这 3 个选项时，我不能回去了..

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

我正在做这样的事情，但它仅适用于一个选项而不是多个选项，并且没有保留解决方案来再次找到我过滤的产品：

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

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

【问题讨论】：

别担心，你现在很沮丧，但你可以解决它。可以分享更多代码吗？
对你的问题一无所知，但你应该通过这个修改对setState函数的调用：this.setState(state => ({ activeOrigin: originValue, displayProducts: state.displayProducts.filter(product => product.origin == originValue) }));

标签： javascript arrays reactjs react-native

【解决方案1】：

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

【讨论】：