Reactjs 如何从html执行react组件
我开始构建一个react组件来学习如何。我想将它嵌入到现有的html页面中（好吧，反正是erb），但我不确定如何让它执行 刷新页面不会执行任何操作，也不会呈现react组件中的内容。控制台日志也没有出现，所以我猜它没有执行Reactjs 如何从html执行react组件,reactjs,erb,Reactjs,Erb,我开始构建一个react组件来学习如何。我想将它嵌入到现有的html页面中（好吧，反正是erb），但我不确定如何让它执行 刷新页面不会执行任何操作，也不会呈现react组件中的内容。控制台日志也没有出现，所以我猜它没有执行 // in main_control.js var MainControl = React.createClass({ render: function() { return <div>Something something Dark Side<
// in main_control.js
var MainControl = React.createClass({
render: function() {
return <div>Something something Dark Side</div>;
}
});
ReactDOM.render(
<MainControl />,
document.getElementById('main_control')
);
// in the html file
<head>
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src='/components/main_control.js' type='text/babel'>
</script>
</head>
<h3>control for <%= @site.site_name %> </h3>
<div id="main_control"></div>
//在main_control.js中
var MainControl=React.createClass({
render:function（）{
返回黑暗的一面；
}
});
ReactDOM.render(
,
document.getElementById（'main_control'））
);
//在html文件中
控制
显示的唯一内容是标签中的内容，这是创建无状态组件的方法：
const MainControl=（）=>{
退回一些黑暗面的东西
};
ReactDOM.render(
,
document.getElementById（'main_control'））
)
控制