Hello word !!

Question

拜托，有人可以用react来解决我的问题。我正在尝试在div命名标题中渲染Hello World，但是没有显示任何内容。我将localhost与server.js一起使用

＆＃13;

ReactDOM.render(
  <h1>Hello, world!</h1>,
  document.getElementById('root')
);

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	 <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
	<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/6.1.19/browser.min.js"></script>

</head>
<body>
	<div id="root"></div>
<script type="text/babel" src="main.js"></script>
</body>
</html>

＆＃13;

图片链接： http://prntscr.com/j2r5wr

错误：

http://prntscr.com/j2rd5s

Answer 1

首先是dom渲染中的错误：

ReactDOM.render(
  <Helloworld />, 
  document.getElementById('header')
);

Answer 2

创建组件的3种方法。不需要使用React.createClass（如图所示）

直接返回某些jsx的简单功能组件

const HelloWord =（）=＆gt; （

Hello word !!
）
正常功能组件

const HelloWord =（）=＆gt; { 回来（

Hello word !!
） }
班级组件

类HelloWord扩展了React.Component { render（）{ 回来（

Hello word !!
） } }

然后像

render(<HelloWord />, document.querySelector('#root'));

渲染reactjs组件不起作用localhost

2 个答案:

Hello word !!

Hello word !!

Hello word !!