瞭解React中的渲染錯誤

這是我第一次遇到反應。我不明白爲什麼下面的代碼在render函數上返回錯誤。瞭解React中的渲染錯誤

var LikeButton = React.createClass({ 
     getInitialState: function() { 
      return { liked: false }; 
     } 

     render: function() { 
      if (this.state.liked) 
       return <div>Ti piace!</div> 
      else 
       return <a href="#" onClick={this.doLike}>Mi piace</a> 
     } 

     doLike: function() { 
      this.setState({ liked: true }); 
     } 
    }); 
    ReactDOM.render(<LikeButton />, document.body);

此代碼在標籤<script type = "text/babel">。

來源

2017-10-04 Johnnny

笏是錯誤？！ – Panther

React.createClass接受一個對象作爲參數，並且需要由逗號（，）被分離的物體的每個屬性。

你只需要做到這一點：

var LikeButton = React.createClass({ 
    getInitialState: function() { 
     return { liked: false }; 
    }, // comma 

    render: function() { 
     if (this.state.liked) 
      return <div>Ti piace!</div> 
     else 
      return <a href="#" onClick={this.doLike}>Mi piace</a> 
    }, // comma 

    doLike: function() { 
     this.setState({ liked: true }); 
    } 
}); 
ReactDOM.render(<LikeButton />, document.body);

你可以看到工作this fiddle你的代碼。

來源

2017-10-05 12:38:07 Jalissa

看來，雖然您在腳本類型中提供了babel，但這並不意味着您的代碼實際編譯了。

您可以嘗試Create React App實用程序來爲React開發設置有效的環境。

來源

2017-10-04 15:41:57 iofjuupasli

誤差如下：

Uncaught SyntaxError: embedded: Unexpected token (7:3) 
    5 |   } 
    6 | 
> 7 |   render: function() { 
    | ^
    8 |    if (this.state.liked) 
    9 |     return <div>Ti piace!</div> 
    10 |    else 
    at Parser.pp.raise (browser.js:65620) 
    at Parser.pp.unexpected (browser.js:66850) 
    at Parser.pp.expect (browser.js:66844) 
    at Parser.pp.parseObj (browser.js:65244) 
    at Parser.pp.parseExprAtom (browser.js:65040) 
    at Parser.parseExprAtom (browser.js:68226) 
    at Parser.pp.parseExprSubscripts (browser.js:64884) 
    at Parser.pp.parseMaybeUnary (browser.js:64865) 
    at Parser.pp.parseExprOps (browser.js:64811) 
    at Parser.pp.parseMaybeConditional (browser.js:64793)

來源

2017-10-05 10:09:44 Johnnny

瞭解React中的渲染錯誤

回答

相關問題