javascript - 为什么我的页面变成空白?

标签 javascript html css reactjs

<分区>


这个问题是由于错别字或无法再重现的问题引起的。虽然类似的问题可能是on-topic在这里,这个问题的解决方式不太可能帮助 future 的读者。

关闭 6 年前

我一点击save在我的 IDE 上点击 refresh在我的浏览器上测试我的 prompt()在我的 index.js 中运行文件,我的整个页面都变成空白,导致我什么都看不到,只有一个白屏。我可以发誓我的功能在语法上是正确的。其他一切都很完美,除非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属性后添加,,

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

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

关于javascript - 为什么我的页面变成空白?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41853256/

上一篇:javascript - 为什么 bootstrap 网格类会阻止我的 highchart 图表呈现?

下一篇:html - 使用伪元素设计标题

相关文章:

html - ul li 在它的上 li 有长文本时中断

html - 非 html 属性的 CSS 选择器

html - 将嵌入式 Tableau 仪表板居中

javascript - 如何在绝对定位元素上从右到中心过渡?

javascript - 如何通过 JavaScript 更改文档的样式?

css - HTML5 旋转动画 - 如何显示 "the other side of the coin"?

javascript - RTCPeerConnection connectionState 从不从 "new"移动到 "checking"/"connected"

javascript - 是否可以在 Kendo UI 线性仪表上仅显示最大/最小值?

Javascript - onscroll 顺利移动到下一个 anchor ?如何?

javascript - Angular2,切换选中的复选框列表