Question

如何在PHP文件中正确使用React.js CDN？使用下面的代码，我可以在浏览器中成功显示hey。

这是我的代码：

<?php
<!DOCTYPE html>
<html lang="en">
<head>

    <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
    <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
    <script type="text/jsx">
        class Temp extends React.Component {
            render() {
                return(
                    <div>
                        <h1>hey</h1>
                    </div>
                );
            }
        }

        ReactDOM.render(<Temp />, document.getElementById("app"));
    </script>

</head>
<body>
    <div id="app"></div>
</body>
</html>

但是这次，我希望通过另一个js文件Temp.js显示它。我在下面的尝试未在浏览器上显示任何内容。我觉得我犯了一个小错误，但找不到它。

我完全了解create-react-app的工作方式，我只是想尝试一下CDN并查看其工作方式。

我在做什么错，我该如何解决？

这里是Temp.js：

var Temp = React.createClass({

constructor(props) {
    super(props);
    this.state = {
        term: 'test'
    };
};

render() {
    return(
        <div>
            <h1>{this.state.term}</h1>
        </div>
    );
}
});

ReactDOM.render(<Temp />, document.getElementById('app'));

Answer 1

不熟悉通过CDN导入react，但是我可以通过用

替换您拥有的CDN来使其工作

<script src="https://unpkg.com/react@15/dist/react.min.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.min.js">  </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.24.0/babel.js"></script>

来源：React CDN based page not working with Babel 6.1.19

可能与使用开发版本的react有关吗？

如何在PHP文件中正确使用React.js CDN？

1 个答案: