gpt4 book ai didi

javascript - ReactJs + Babel - 使用单独的文件定义组件

转载 作者:行者123 更新时间:2023-11-29 10:38:34 25 4
gpt4 key购买 nike

试图用单独的文件创建一个组件类

索引.html

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="../../assets/libs/react-0.13.3/build/react.js"></script>
<script src="../../assets/libs/babel.min.js"></script>
</head>
<body>
<section class="reactive"></section>
<script type="text/babel" src="../../components/AppBar/NavBar.js"></script>
<script type="text/babel">
var
reactiveNode = document.querySelector('.reactive');
React.render( <NavBar value='hello world'/>, reactiveNode );
</script>
</body>
</html>

导航栏.js

var NavBar = React.createClass({
render: function ()
{
return ( <h1>{this.props.value}</h1> );
}
});

运行后,我有日志:

XHR finished loading: GET "http://localhost:3000/app/components/AppBar/NavBar.js"

Uncaught ReferenceError: NavBar is not defined

只有在 index.html 文件中创建类才有效

最佳答案

问题出在变量的范围上。

使用解决

window.NavBar = React.createClass({
// ...
});

关于javascript - ReactJs + Babel - 使用单独的文件定义组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32927820/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com