javascript - 嵌套数组如果值相等则将对象添加到状态数组

标签 javascript reactjs

我正在尝试迭代嵌套的 for 循环。如果某个值等于某个值,我想将该对象添加到我所在状态的数组中。

this.state = {
    custBehavior: [],
    custService: [],
    custEngagement: [],
    custUsage: []
  }

代码

this.props.insights.map((behavior) =>
  behavior.map((items) =>
    {if (items.scoreCategory === "Behavior") {
      this.setState(behaviorInsight => ({
        custBehavior: [...behaviorInsight.custBehavior, items]
      }))
    }}
  )

prop 信息是下面的完整 json。

如果我删除 if 语句并执行此操作....

this.props.insights.map((behavior) =>
  behavior.map((items) =>
    console.log(items)
  )
);

我将打印出数组中的每个对象,同样,示例 json 如下。

示例数据

[{
            "scoreModelId": "DNA_APPLE_HML_TAG",
            "scoreDisplayName": "Apple Enthusiast",
            "scoreCategory": "Behavior",
            "scoreSystem": "LMH",
            "scoreValue": "HIGH",
            "scoreDate": "2019-01-05",
            "scoreLevel": "L",
            "scorePriority": 1
        }, {
            "scoreModelId": "DNA_GOOGLE_HML_TAG",
            "scoreDisplayName": "Google Enthusiast",
            "scoreCategory": "Behavior",
            "scoreSystem": "LMH",
            "scoreValue": "HIGH",
            "scoreDate": "2019-01-05",
            "scoreLevel": "L",
            "scorePriority": 1
        }, {
            "scoreModelId": "MG6M_IN_A",
            "scoreDisplayName": "LTV Model",
            "scoreCategory": "Segmentation",
            "scoreSystem": "DECIMAL",
            "scoreValue": "14.06",
            "scoreDecile": "2",
            "scoreCentile": "13",
            "scoreDate": "2019-01-14",
            "scoreLevel": "L"
        }]

感谢您的帮助,看不到我在这里缺少的内容。

最佳答案

您可以通过使用reduce来实现它。然后,您可以通过过滤每个行为对象将每个items添加到最终数组中。

你应该只设置一次状态,因为它是一个异步函数

const custBehavior = this.props.insights.reduce(
    (acc, behavior) => [...acc, ...behavior.filter(items => items.scoreCategory === "Behavior")], //Takes out every item corresponding to the filter and adds them to the final array
    [] //The starting value, an empty array
)
this.setState({ custBehavior })

要将其应用于其他类型,您可以使用上面的代码创建一个函数:

customCategory = (category, name) => {
    const custThing = this.props.insights.reduce(
        (acc, behavior) => [...acc, ...behavior.filter(items => items.scoreCategory === category)],
        []
    )
    this.setState({ [name]: custThing })
}

//

this.customCategory('Behavior', 'custBehavior')
this.customCategory('Segmentation', 'yourStateVariableName')

state 变量名称将使用计算属性设置,过滤器参数也通过函数参数给出。

关于javascript - 嵌套数组如果值相等则将对象添加到状态数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54910373/

相关文章:

javascript - 在移动版 Safari 中针对多页 PDF 强制打印对话框

javascript - 自定义 toString 的推荐方式是什么?使用 Symbol.toStringTag 还是覆盖 toString?

reactjs - React-router-redux 推送操作不起作用

reactjs - 从 Lighthouse for Google Recaptcha 和 Google Maps API 解决 "Remove unused Javascript"的最正确方法

javascript - 在构造函数类中调用函数

node.js - 如何解决 npm install react-select failure with error : An unknown git error occurred, git@github.com :Permission denied (publickey)

javascript - 想要在全日历插件的周 View 中一次显示 3 天

javascript - ES2015 模板字符串未解析

javascript - wordpress php 问题将 html 元素回显到页面

reactjs - React .- JSX 中的 reduce() 未渲染