javascript - React.js 给出了意外的 token

Question

我是 React.JS 新手。我正在尝试一个非常简单的布局，但它在“this”关键字之前的括号中给出了错误。为什么它会给出错误？任何帮助将不胜感激。

import React, { Component } from 'react';
import { Col, Grid, Row } from 'react-bootstrap';
import { NavMenu } from './NavMenu';
import Header from './Header'
import Footer from './Footer'

export class Layout extends Component {
  displayName = Layout.name

  render() {
      return (
          <Header />
            {this.props.children}
          <Footer />
      );
  }
}

Answer 1

您只能从 React 组件返回一个元素。要返回多个同级，您需要用 <></> 包装返回的元素。像这样

我添加//change在我编辑的行上方

return (
    //change
    <>
        <Header />
            {this.props.children}
        <Footer />
    //change
    </>
  );