Visjs/React：动态构建数据集答案

【问题标题】：Visjs/React: Building a DataSet DynamicallyVisjs/React：动态构建数据集
【发布时间】：2019-06-06 22:58:10
【问题描述】：

我正在从服务器请求数据，然后尝试将其分配给items。 console.log 显示正确的数据，但出现错误：Failed prop type: Invalid props 'items' of type 'object supplied to Timeline, expected array'. I thoughtitems.add` 将数据集转换为数组？

var items = new vis.DataSet();
items.add(data.abs.map(a, index) => ({
  id: index + 1, 
  content: a.Ent, 
  start: a.time, 
  title: a.Trc, 
  end: null
})));

数据：

"data": {
  "abs": [
    {
      "Ent": "Changed",
      "time": 1499348050000,
      "Trace": [
        {
          "filename": "C:/Users/Public/Desktop/word.doc"
        }
      ]  
    }

【问题讨论】：

您是否也可以共享响应数据，以便这里的任何人检查您是否正确使用它？您也不会在 map 函数中引用元素 a，如果您想访问原始数组 abs，则需要将其作为第三个参数传递。你真的打算做content: a.Ent 等吗？ add 不是数组函数，所以我很确定 items 不是数组，这就是你收到 propType 警告的原因。 items 是一个集合吗？

标签： javascript reactjs vis.js vis.js-network vis.js-timeline

【解决方案1】：

根据vis.dataset docs，add 不会转换数据集，它只是返回添加项目的 id 数组。在您的代码示例中，变量 items 实际上是数据集对象本身。当您调用 items.add(... 时，该表达式确实返回了一个数组，但您没有捕获它。我假设您将项目作为道具传递，它仍然是数据集对象，但您可以使用 ::map 函数，它返回一个数组。

【讨论】：

你能提供使用::map的例子吗？
就像javascript的array::map, codesandbox demo