我的世界Hello没出现

时间:2018-07-07 18:50:37

标签: reactjs

我是React的新手。我阅读了React的官方教程,并尝试创建一个基本的hello world react应用程序,但没有成功。 我在网上和这里都找到了答案,但没有找到答案。 您能告诉我我想念的是什么,我需要做什么? 以下是我的html和javascript文件:

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
    <h1>Hello, World</h1>,
    document.getElementById('root')
  );
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
    <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 type="text/jsx" src="inputPhoneNumber.js"></script>
</head>
<body>
    <div class="jumbotron jumbotron-fluid">
        <div id="root" class="container">           
        </div>
    </div> 
</body>
</html>

1 个答案:

答案 0 :(得分:1)

您所需要的只是您已经拥有的reactreact-dom脚本,一个拥有ID为div的{​​{1}}之类的根元素,以及一个文件使用root将最上面的组件渲染到根元素中。

示例

ReactDOM
ReactDOM.render(
  React.createElement('h1', {}, 'Hello, World'),
  document.getElementById('root')
);