Question

我正在尝试使用React.js，但是当我尝试在脚本balise中使用诸如'h1'或'div'之类的Balise时，其余代码都没有考虑在内。我看到很多论坛都在使用它，但是我不知道它是如何工作的。

<html>
<meta charset=utf-8>
<link rel="stylesheet" type="text/css" href="style.css">

<script src="reactJS/build/react.js"></script>
<script src="reactJS/build/react-dom.js"></script>

<div id="root"></div>

<script>
    function formatName(user) {
        return user.firstName + ' ' + user.lastName;
    }

    const name = 'Josh Perez', 
    element = <h1>Hello, {name}</h1>;

    ReactDOM.render(
      element,
      document.getElementById('root')
    );
</script>

第12行中的“ /”使其余代码无法使用，并且不再像脚本编写者那样发挥作用。

在此先感谢您的帮助。（对不起，如果我的英语真的也很差）

Answer 1

您还需要添加babel与JSX一起使用，

<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>

还要确保在您的type="text/babel"标签上添加script。

<script type="text/babel">  //Add type here
    function formatName(user) {
        return user.firstName + ' ' + user.lastName;
    }

    const name = 'Josh Perez', 
    element = <h1>Hello, {name}</h1>;

    ReactDOM.render(
      element,
      document.getElementById('root')
    );
</script>

有关更多信息，请检查this。

我不能在<script>内使用<h1>

1 个答案: