2014-11-04 29 views
5

當我嘗試和運行Transferring with ... in JSX例如更新後的0.12反應文檔中的語法錯誤?

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

這是錯誤還是一些額外的代碼transpilation所需的這個工作?

回答

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