首页 > 解决方案 > React - 在同一个文件中导出多个类

问题描述

我正在做一个反应项目,我有多个组件。我正在尝试在 JSBin 中完成这一切(哈哈……我知道)。但是我在导出多个类时遇到问题。

class Foo extends React.Component {
    constructor(props) {
        super(props);

        this.state = {

        }
    }

    render() {
        return (
            <div></div>
        );
    }
}


class Bar extends React.Component {
    constructor(props) {
        super(props);

        this.state = {

        }
    }

    render() {
        return (
            <div></div>
        );
    }
}

export class Foo{};
export class Bar{};

但我收到一个错误

  Parsing error: Identifier 'Foo' has already been declared
  92 | }
  93 | 
> 94 | export class Foo{};
     |              ^
  95 | export class Bar{};

所以我试着把它改成这个

class Foo extends React.Component {...my code}
class Bar extends React.Component {...my code}

它编译但我得到一个运行时错误

Error: Element type is invalid: expected a string (for built-in components) or a class/function       (for composite components) but got: object.

是否可以通过反应在单个文件中导出多个类?

标签: javascriptreactjs

解决方案


这是因为你在底部重新声明了类,你可以像下面这样导出你的类。

export class Foo extends React.Component {
   // your code
}

export class Bar extends React.Component {
  // your code
}

推荐阅读