我有一个 ReactJS 的空白页面 - 我是刚开始的新手

Question

这是在 ubuntu 服务器上安装 Reactjs，然后启动应用程序时的默认安装。 因此，在这个文件的 ./public/index.html 中，我有一个名为 root 的位置，index.js 文件（其内容如下）插入如下所示的 Reactjs 代码。

端口 3000 上显示 react 徽标的 reactjs 的默认屏幕，现在显示空白页。

import React from 'react';
import ReactDOM from 'react-dom';
// import './index.css';
// import * as serviceWorker from './serviceWorker';


class component1Class extends React.Component {
    render() {
            return <h1>  hello world  </h1>;
            return <h1>hello world</h1>;
            return <h1>hello world</h1>;
            return <h1>hello world</h1>;
      }
      };


ReactDOM.render(<component1Class />, document.getElementById('root'));

Answer 1

组件必须以大写字母开头。将component1Class 更改为Component1Class。你也可以在一个组件中只返回一次。

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

class Component1Class extends React.Component {
  render() {
    return (
      <h1>hello world</h1>
      <h1>hello world</h1>
      <h1>hello world</h1>
      <h1>hello world</h1>
    );
  }
};

ReactDOM.render(<Component1Class />, document.getElementById('root'));