5

我在这里松散地关注facebooks React教程， http: //facebook.github.io/react/docs/getting-started.html，但我将它应用到不同的html文件。

这是我的 html 文件，基于 react 入门套件：

<html>
  <head>
    <title>Hello React</title>
    <script src="http://fb.me/react-0.8.0.js"></script>
    <script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/showdown/0.3.1/showdown.min.js"></script>
  </head>
  <body>
    <div id="content"></div>
    <script src="build/comment.js"></script>
  </body>
</html>

我安装了 react-tools，现在当我运行“jsx --watch src/build/”

它正在转换这个片段：

var CommentBox = React.createClass({
  render: function() {
    return (
      <div className="commentBox">
        Hello, world! I am a CommentBox.
      </div>
    );
  }
});
React.renderComponent(
  <CommentBox />,
  document.getElementById('content')
);

进入这个片段：

var CommentBox = React.createClass({displayName: 'CommentBox',
  render: function() {
    return (
      react.DOM.div( {className:"commentBox"}, 
        " Hello, world! I am a CommentBox. "
      )
    );
  }
});
React.renderComponent(
  CommentBox(null ),
  document.getElementById('content')
);

但是本教程显示了这个片段：

// tutorial1-raw.js
var CommentBox = React.createClass({
  render: function() {
    return (
      React.DOM.div({
        className: 'commentBox',
        children: 'Hello, world! I am a CommentBox.'
      })
    );
  }
});
React.renderComponent(
  CommentBox({}),
  document.getElementById('content')
);

由于小写'r'，网页抛出错误，“react is not defined”。这是真的。从 chrome 的控制台，我可以确认定义了“React”，而不是“react”。

如教程中所述，如何让 jsx 构建正确的输出？

4

1 回答 1

7

在 JSX 文件的顶部，您应该有以下注释：

/** @jsx React.DOM */

我猜你把它打错了react.DOM。

于 2014-01-15T06:50:48.947 回答