在React JS中使用道具时是否可以使用点表示法？

Question

我有一个本地json对象，我可以通过名称调用它来传递给React类，但是当我尝试传递对象的属性时，我收到一个错误。使用React时是否可以使用javascript点表示法？

这是有效的JSON：

var Player = {
    {
      "name": "Money",
      "value": 0
    },
    {
      "name": "Market Share",
      "value": 0
    }
  }
};

和可行的React代码：

React.render(
  <StatsPane stats={Player} ticker={Settings.eventTickRate} />,
  document.getElementById('stats-pane')
);

当我尝试将javascript对象更改为：

var Player = {
  "stats": {
    0: {
      "name": "Money",
      "value": 0
    },
    1: {
      "name": "Market Share",
      "value": 0
    }
  }
};

并使用点符号调用“stats”：

React.render(
  <StatsPane stats={Player.stats} ticker={Settings.eventTickRate} />,
  document.getElementById('stats-pane')
);

我收到以下错误：

Answer 1

  

使用React时是否可以使用javascript点表示法？

错误不在您发布的代码中。它与React或JSX无关。

如您所见，错误消息指向

this.setState({stats: {Player.stats}});
//                          ^

{Player.stats}对JavaScript对象文字无效。这是一个更简单的例子，可以重现这个问题：

> var foo = {bar.baz};
Uncaught SyntaxError: Unexpected token .

我相信你想要

 this.setState({stats: Player.stats});

或类似的东西。