reactjs的数据流组件写在不同的外部文件中可以吗？
1.代码展示：
我想在多个页面中复用Card组件，Card组件写在src/card-render.js中。
var Card = React.createClass({
render:function(){
return (
<div>
This is a card.
</div>
);
}
});
在Channel组件中引用Card组件，Channel组件写在src/channel-render.js中。
var Channel = React.createClass({
render:function(){
return (
<Card />
);
}
})
ReactDOM.render(
<Channel />,
document.getElementById('content');
);
我用了react-tool对jsx语法进行了转换,jsx --watch src/ build/,而test.html内容如下：
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Hello React!</title>
<script src="build/react.js"></script>
<script src="build/react-dom.js"></script>
<script src="build/browser.min.js"></script>
</head>
<body>
<div id="content">
</div>
<script src="build/card-render.js"></script>
<script src="build/channel-render.js"></script>
</body>
</html>2.问题描述
事实上，这些位于不同的Javascript文件中的组件的相互引用没有生效，请问：
(1)数据流组件不能定义在不同的Javascript文件中吗？这样的话组件复用岂不非常麻烦？
(2)如果可以，那么我的问题在哪里呢？
展开
收起
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
1
条回答
写回答
-
在card-render.js 这个js文件中，你需要export Card
在channel-render.js中，你需要import {Card} from 'card-render.js'
上面那个是在es6的写法，如果是es5的话就 var Card = require 'card-render.js'
这样才可以2019-07-17 19:00:48赞同 展开评论
相关问答