我试图从我的 html 中引用 jsx 文件,但渲染函数没有显示任何内容,并且控制台中没有任何错误。
*注意 - 我更改了下面的 Facebook CDN 链接,因为 SO 不允许它们。 CDN 链接不是问题。
我的代码如下所示:
HTML
<html>
<head>
<script src="https://f*b.me/react-0.14.6.js"></script>
<script src="https://f*b.me/react-dom-0.14.6.js"></script>
<script src="http://f*b.me/JSXTransformer-0.12.1.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>
<body>
<div class="container">
<div id="loggedin"></div>
</div>
<script type="text/babel" src="js/script.jsx"></script>
</body>
</html>
JSX
var App = React.createClass({
render: function() {
return(
<h1>Hello</h1>
)
}
});
ReactDOM.render(<App />, document.getElementById('loggedin'));
最佳答案
React 使用 babel 将 jsx 转换为 js。因此,添加 babel
而不是 JSXTransformer
并将文件保存为 .js
而不是 .jsx
将其添加到您的脚本中
<script src="https://unpkg.com/babel-core@5.8.38/browser.min.js"></script>
关于javascript - 在 html 中引用 jsx 文件时,React 渲染方法不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39768764/