更新的0.12反应文档中的语法错误?

时间:2014-11-04 13:46:42

标签: reactjs

当我尝试运行Transferring with ... in JSX示例

var FancyCheckbox = React.createClass({
  render: function() {
    var { checked, ...other } = this.props;
    var fancyClass = checked ? 'FancyChecked' : 'FancyUnchecked';
    // `other` contains { onClick: console.log } but not the checked property
    return (
      <div {...other} className={fancyClass} />
    );
  }
});
React.render(
  <FancyCheckbox checked={true} onClick={console.log}>
    Hello world!
  </FancyCheckbox>,
  document.body
);

我得到Uncaught SyntaxError: Unexpected token {。我尝试在jsfiddle

中运行它时也一样

这是一个错误,还是需要一些额外的代码转换才能生效?

1 个答案:

答案 0 :(得分:5)

要使用此功能,您必须拥有harmony enabled。不幸的是,您使用的小提琴集成并没有启用它。

有一个commit made recently可以添加它,所以它很可能会在那里。

如果您想立即使用它,您可以将文件托管在某个地方,或者只是将脚本直接添加到小提琴中:

<script>
  (function () {
    var tag = document.querySelector(
            'script[type="application/javascript;version=1.7"]'
    );
    if (!tag || tag.textContent.indexOf('window.onload=function(){') !== -1) {
      alert('Bad JSFiddle configuration, please fork the original React JSFiddle');
    }
    tag.setAttribute('type', 'text/jsx;harmony=true');
    tag.textContent = tag.textContent.replace(/^\/\/<!\[CDATA\[/, '');
  })();
</script>

重要的一行是'text/jsx;harmony=true'Check the updated fiddle