Question

我按照以下教程进行操作： http://facebook.github.io/react/docs/tutorial.html

我在Firefox开发人员工具控制台中收到以下错误：

SyntaxError：expect expression，got＆＃39;＆lt;＆＃39; tutorial.js：4：3

浏览器窗口没有显示任何内容。我在教程中的印象是，我应该看到JS文件底部的数据数组中给出的信息。我打开index.html文件作为本地文件（不运行服务器）。为什么要赢得这项工作呢？

我的项目如下：

＆＃13;

var Comment = React.createClass({
	render: function() {
		return (
			<div className="comment">
				<h2 className="commentAuthor">
					{this.props.author}
				</h2>
					{this.props.children}
			</div>
		);
	}
});
var CommentBox = React.createClass({
	render: function() {
		return (
			<div className="commentBox">
				<h1>Comments</h1>
				<CommentList data={this.props.data} />
				<CommentForm />
			</div>
		);
	}
});

var CommentList = React.createClass({
	render: function() {
		var commentNodes = this.props.data.map(function(comment) {
			return (
				<Comment author={comment.author}>
					{comment.text}
				</Comment>
			);
		});
		return (
			<div className="commentList">
				{commentNodes}
			</div>
		);
	}
});

var CommentForm = React.createClass({
	render: function() {
		return (
			<div className="commentForm">
				Hello, world! I am a CommentForm.
			</div>
		);
	}
});


React.render(
	<CommentBox data={data} />,
	document.getElementById("content")
);

var data = [
	{author: "Pete Hunt", text: "This is one comment"},
	{author: "Jordan Walke", text: "This is another comment"}
];

＆＃13;

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>Hello React</title>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.0/react.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.0/JSXTransformer.js"></script>
		<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	</head>
	<body>
		<div id="content"></div>
		
		 <script src="scripts/tutorial.js"></script>
	</body>
</html>

＆＃13;

Answer 1

您需要将function isEven(number) { return (function subTwo(number) { if (number === 0) { return true; } else if (number === 1) { return false; } else if (number > 0) { number -= 2; return subTwo(number); } else { console.log("bruh"); } })(number); };添加到type="text/jsx"的脚本元素中。

tutorial.js

<强>更新

对于TypeError，这是因为您在尝试渲染后声明了数据。交换这两行的顺序：

<script type="text/jsx" src="scripts/tutorial.js"></script>

到此：

React.render(
    <CommentBox data={data} />,
    document.getElementById("content")
);

var data = [
    {author: "Pete Hunt", text: "This is one comment"},
    {author: "Jordan Walke", text: "This is another comment"}
];

反应教程 - 在数组中加载数据时，firefox出错

1 个答案: