在React Js（Babel）中无法使用连字符“ - ”访问JSON属性

Question

我正在构建一个小的React组件（使用Babel编译）。我必须使用名称中的破折号访问属性。

this.setState({
  newArtist: {
    birthdate: artist.life-span.begin
  }
});

此代码抛出错误未捕获的ReferenceError：未定义span

经过一些研究，我发现我需要使用替代的notatio使用支架。的 [＆＃39;寿命＆＃39;]

this.setState({
  newArtist: {
    birthdate: artist['life-span']begin
  }
});

但是这个让Babel抛出语法错误。

bundle.js：1语法错误：/ file / path：解析文件时出现意外的令牌，（24:38）

所以我被困在这里。

我的babel配置相当精简，只使用es2015＆amp;反应预设。

知道它可能是什么吗？

Answer 1

currency

而不是birthdate: artist['life-span'].begin

Answer 2

你必须要理解这样的基础知识：属性必须用方括号进行调整和舍入，或者从点开始。 所以在物业链中：

var propNameInVar = "prop5";
object   ["prop1"]   .prop2   [3]   .prop4   [propNameInVar]   .prop6