JSX代码:
var App = React.createClass({
render: function() {
return <div className="darken">hello world</div>
}
});
React.renderComponent(<App/>, document.querySelector('.main'))
HTML:
<body>
<header>welcome</header>
<div class="main"></div>
</body>
React.renderComponent将渲染的JSX附加到<div class="main">。 HTML的输出将是:<body>
<header>welcome</header>
<div class="main">
<div class="darken">hello world</div>
</div>
</body>
是否可以将
React.renderComponent替换为<div class="main">，所以我期望这样:<body>
<header>welcome</header>
<div class="darken">hello world</div>
</body>
最佳答案
让我的组件在React 0.14.0中呈现时出现问题。我的解决方案是确保您的脚本具有特殊类型:
<script type="text/babel" src='js/app.js'></script>
包括以下三个库:
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.0/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.0/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
然后使用
ReactDOM.render():ReactDOM.render(<Timer start={Date.now()} />, document.getElementById('app'));
我什至没有使用ES6或构建系统。使用react.js在屏幕上获取文本的简单解决方案
关于reactjs - react renderComponent替换DOM，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/24762433/