Graphql / React-Apollo: ошибка функции карты Reac

В консоли я вижу следующее в данных. Кажется, я неправильно использую функцию карты:

{data: {action: [{action: "Changed", timestamp: 1499348050,a€¦},a€¦]}} data:{action: [{action: "Changed", timestamp: 1499348050,a€¦},a€¦]} action:[{action: "User Assist Changed", timestamp: 1499348050,a€¦},a€¦]

Я пытаюсь графа данных, используя следующую функцию, но экран пуст:

render() {
    console.log('graph nodes:', this.props.data)
    return (
        <svg width={this.props.width} height={this.props.height}>
        {Object.keys(this.props.data).map((data, index) =>(
     <circle r={data.r} cx={data.x} cy={data.y} fill="red" key={index}/>
))}
      </svg>
    );
  }//render

javascript,reactjs,graphql,react-apollo,map-function,

0

Ответов: 1


0

Вам нужно сопоставить действие, а не ключи данных.

{
  this.props.data.action.map((data, index) => (
    <circle r={data.r} cx={data.x} cy={data.y} fill="red" key={index}/>
  );
}

Это предполагает, что эти свойства существуют внутри каждого действия.

Если вы хотите использовать карту над действием, попробуйте запустить эту строку в верхней части рендера

this.props.data.action.map(item => console.log("this is an action: ", item));

Это покажет вам информацию в каждом действии, чтобы вы могли манипулировать ею так, как вы ожидаете этого.

JavaScript, reactjs, graphql, реагируют-аполлон, карта-функции,
Похожие вопросы