ReactJS ES6阵列过滤

Question

我正在尝试将数据从对象分组到多维数组

在过去的三天里，我尝试了多种方法来获得我想要的结果。 因为我没有运气，可能是因为我对ReactJS / ES6知之甚少。 我希望有人可以解释我是如何让这个工作的。

我想我将不得不使用地图功能。 在map函数中，有一个过滤函数可以获取唯一的公司然后循环来添加表信息。

最终结果应该是这样的： https ： //wireframe.cc/No5uB7

我要过滤的数据：

{
  "viewings": [
    {
      "companyXXX": "company-XXX",
      "time_start": "02/04/2019",
      "time_end": "03/04/2019 11:59"
    },
    {
      "companyXXX": "company-XXX",
      "time_start": "14/04/2019",
      "time_end": "15/04/2019 11:59"
    },
    {
      "companyYYY": "company-YYY",
      "rejection": 40,
      "time_start": "14/04/2019",
      "time_end": "15/04/2019 11:59"
    }
  ]
}

我仍然有的代码不起作用

    genData(data) {
      const di = data.viewings;

      let mps = [];

      di.map(m => mps.push(m.company));
      mps = Array.from(new Set(mps));

        console.log( mps );


       let mps = [];

       di.map((m) => 
         console.log( di.filter(mps => m.company) )
         );
    }

Answer 1

欢迎来到StackOverflow。

map函数将返回一个列表。 在您的情况下，您可以轻松使用forEach方法而不是地图 。

......这些：

datas.forEach(data=>myArray.push(data.company))

有关map和forEach的更多信息，请参阅以下链接：

JavaScript：.forEach（）和.map（）之间的区别

https://codeburst.io/javascript-map-vs-foreach-f38111822c0f

Answer 2

如果您的输入数据更加一致，我可能会提供帮助，特别是因为您正在尝试编写m.company ，除非每次查看都有company对象，否则这并不意味着什么。

{
  "viewings": [
    {
      "company": "company-XXX",
      "time_start": "02/04/2019",
      "time_end": "03/04/2019 11:59"
    },
    {
      "company": "company-XXX",
      "time_start": "14/04/2019",
      "time_end": "15/04/2019 11:59"
    },
    {
      "company": "company-YYY",
      "time_start": "14/04/2019",
      "time_end": "15/04/2019 11:59"
    }
  ]
}

然后你可以写：

var viewings = data.viewings.

var firstViewing = viewings[0];

var firstCompany = firstViewing.company;
var firstTimeStart = firstViewing.time_start;
// etc...

您的输入数据应该更加结构化。

然后您可以注销每个公司名称：

var viewings = data.viewings;

viewings.forEach(v => {
    console.log(v.company);
});

你在问题中提到了JSX，但是没有JSX代码。 这似乎是您对JS而不是JSX的了解的问题。