我有commentBox.jsx文件,包含以下代码:
var CommentBox = React.createClass( { render: function () { return ( <div className="commentBox"> <h1>Comments</h1> </div> ); } });
在index.html中,我想渲染此组件:
<div id="content"></div> <script type="text/babel" src="scripts/commentBox.jsx"></script> <script type="text/babel"> ReactDOM.render(<CommentBox />,document.getElementById( 'content' ) ); </script>
但我收到错误:“CommentBox未定义”;为什么这不起作用?
如果我将所有代码放在一个文件(commentBox.js) – 它将工作.
你需要声明var CommentBox;在其自己的脚本块中高于其他两个.您的脚本导入之间不共享变量的范围.
<div id="content"></div> <script> var CommentBox; </script> <script type="text/babel" src="scripts/commentBox.jsx"></script> <script type="text/babel"> ReactDOM.render(<CommentBox />,document.getElementById( 'content' ) ); </script>
您还可以从jsx文件中删除var.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。