Javascript React-在同一文件中导出多个类

我正在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{};

然后我试着把它改成这个

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.

---

使用react可以在一个文件中导出多个类吗？

因为您要在底部重新声明类，所以可以像下面这样导出类

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

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

---

您可以像往常一样声明类，然后在文件末尾导出所有类，如下所示

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 { Foo, Bar };

类Foo扩展了React.Component{
建造师（道具）{
超级（道具）；
this.state={}；
}
render（）{
返回；
}
}
类栏扩展了React.Component{
建造师（道具）{
超级（道具）；
this.state={}；
}
render（）{
返回；
}
}
出口{Foo，Bar}；

或者，如果愿意，可以在声明类时将其导出

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

    this.state = {};
  }

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

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

    this.state = {};
  }

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

导出类Foo扩展React.Component{
建造师（道具）{
超级（道具）；
this.state={}；
}
render（）{
返回；
}
}
导出类栏扩展了React.Component{
建造师（道具）{
超级（道具）；
this.state={}；
}
render（）{
返回；
}
}

通常，它建议根据每个文件只导出一个组件

您还可以执行以下操作：

export Foo;

export Bar;

---

最后，不要再次声明类。

浏览链接，它与您的问题类似^^我尝试了这些解决方案，但我认为我的错误源于我的类扩展了React.Component，并且都有调用super（）的构造函数？@eskimo_amigo请共享您的jsbin项目您是否尝试导出

导出类Foo.Component

并删除重新声明类Foo的那两行<代码>导出类Foo{}

export Foo;

export Bar;