Question

我的代码在第<div>Hello World!</div>行

处抛出语法错误

这是我的代码

<!DOCTYPE html>
<html>
<head>
    <script src="libs/react.min.js"></script>
    <script src="libs/react-dom.min.js"></script>
</head>
<body>
    <div id="main">

    </div>

<script>
    var MessageComponent = React.createClass({
        render: function() {
            return (

                <div>Hello World!</div>
            );
        }
    });

    ReactDOM.render(
        <MessageComponent message="Lorem" />,
        document.body
    );
</script>    
</body>
</html>

可能是什么问题？

Answer 1

您正在使用JSX语法糖来构建您的UI组件，浏览器不理解这一点。

在它可以工作之前，你必须首先将它转发给JS。

Answer 2

我在页面中添加了Babel

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.min.js"></script>

并将type="text/babel"添加到脚本代码中。这解决了问题

React JS app - Uncaught SyntaxError：意外的令牌＆lt;

2 个答案: