React中的数据集表示

Question

我有一个由两个数据集组成的数组，我想在我的组件中表示它们：

export default [
 [
   [1, 3],
   [2, 5],
   [3, 2],
   [4, 16],
   [18, 5]
 ],
 [
   [1, 16],
   [2, 23],
   [3, 5],
   [4, 3],
   [5, 1]
 ]
];

这是我的组件

  render() {
    return (
      <div>
        <Graph data={this.props.datasets[0]} />
      </div>
    )
  }

我希望能够在我的图中表示这两个数据集：

data={this.props.datasets[0]} 
data={this.props.datasets[1]}

如何将两者都传递给图形组件的数据？

Answer 1

data不是像style那样的保留属性。如果你想单独传递道具，你可以用不同的名字命名。

render() {
  return (
    <div>
      <Graph 
        dataOne={this.props.datasets[0]} 
        dataTwo={this.props.datasets[1]} 
      />
    </div>
  )
}

---

或者，也可以将数据合并到一个数组中。

render() {
  return (
    <div>
      <Graph 
        data={this.props.datasets[0].concat(this.props.datasets[1])}
      />
    </div>
  )
}