首页 > 解决方案 > React.js 给出了意外的令牌

问题描述

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

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 />
      );
  }
}

标签: javascripthtmlreactjsjsx

解决方案


你只能从一个反应组件中返回一个元素。要返回多个兄弟姐妹,您需要<></>像这样包装返回的元素

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

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

推荐阅读