为什么我的页面是空白的？ [关闭]答案

【问题标题】：Why does my page go blank? [closed]为什么我的页面是空白的？ [关闭]
【发布时间】：2017-01-25 21:48:47
【问题描述】：

当我在 IDE 上点击 save 并在浏览器上点击 refresh 以测试我的 index.js 文件中的 prompt() 函数时，我的整个页面变为空白，导致我什么也看不到，只是一个白屏。我可以发誓我的函数在语法上是正确的。除了包含 prompt() 函数外，其他一切都很完美。

这是我的index.html 文件：

<!DOCTYPE html>
<html>

  <head>
     <title>name name</title>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
     <link rel="stylesheet" href="index.css">
     <link rel="stylesheet" href="body.css">
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
     <script src="https://unpkg.com/react@15/dist/react.js"></script>
     <script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.16/browser.js"></script>
  </head>

  <body>
    <div id="firstBar"></div>
    <div id="body"></div>

    <script type="text/babel" src="index.js"></script>
    <script type="text/babel" src="body.js"></script>
  </body>

</html>

这是我的index.js 文件：

 var TitleBar = React.createClass({
  prompt: function() {
    alert("This works!");
  }

  render: function() {
    return(
     <div className="jumbotron">
      <div className="container">
      <kbd className="fullName"name name/kbd>
        <button onClick={this.prompt} type="button" className="btn btn-primary portfolio">Portfolio</button>
        <button type="button" className="btn btn-primary about">About</button>
        <button type="button" className="btn btn-primary contact">Contact</button>
      </div>
      </div>
    );
  }
});

ReactDOM.render(<TitleBar/>, document.getElementById('firstBar'));

这是我收到的error：

    Uncaught SyntaxError: http://127.0.0.1:8080/index.js: Unexpected token (6:2)
    at Parser.pp.raise (browser.js:2027)
    at Parser.pp.unexpected (browser.js:2596)
    at Parser.pp.expect (browser.js:2590)
    at Parser.pp.parseObj (browser.js:1447)
    at Parser.pp.parseExprAtom (browser.js:1250)
    at Parser.parseExprAtom (browser.js:26392)
    at Parser.pp.parseExprSubscripts (browser.js:1097)
    at Parser.pp.parseMaybeUnary (browser.js:1079)
    at Parser.pp.parseExprOps (browser.js:1035)
    at Parser.pp.parseMaybeConditional (browser.js:1018)
browser.js:9170 Uncaught SyntaxError: http://127.0.0.1:8080/index.js: Unexpected token (6:2)
    at Parser.pp.raise (browser.js:2027)
    at Parser.pp.unexpected (browser.js:2596)
    at Parser.pp.expect (browser.js:2590)
    at Parser.pp.parseObj (browser.js:1447)
    at Parser.pp.parseExprAtom (browser.js:1250)
    at Parser.parseExprAtom (browser.js:26392)
    at Parser.pp.parseExprSubscripts (browser.js:1097)
    at Parser.pp.parseMaybeUnary (browser.js:1079)
    at Parser.pp.parseExprOps (browser.js:1035)
    at Parser.pp.parseMaybeConditional (browser.js:1018)

【问题讨论】：

缺少，在属性prompt之后。
对象中的函数之间缺少逗号
@www0z0k 是否可以在渲染函数（）中包含 JQuery 代码？

标签： javascript html css reactjs

【解决方案1】：

在prompt 属性之后添加,，

var TitleBar = React.createClass({
  prompt: function() {
    alert("This works!");
  },

  render: function() {
    ...
  }
})

【讨论】：

哇……真傻。谢谢你。对于浪费您的时间，我深表歉意。
@Kyll 答案可能没用，但它是正确的，我也不能删除它，因为 chompy 批准了它。当 chompy 将删除接受时，我可以删除我的答案。你的downvote没有理由，我的答案是正确的，你应该downvote问题不正确的答案。
如果您将鼠标悬停在反对票的工具提示上，您可以阅读“这个答案没有用”。我完全同意您是正确的，但是 OP 问题的解决方案是微不足道的，因此不太可能帮助未来的访问者。您还可以看到我对这个问题投了赞成票。如果您想进一步讨论这个问题，请随时在Stack Overflow Chat 中创建一个房间，以免给您的答案添加噪音（因此我也删除了我之前的评论）。
@chompy 你能不接受我的回答吗？