React -导出同一文件中的多个类
React -导出同一文件中的多个类
提问于 2019-11-30 13:24:52
我正在做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.是否可以使用react在单个文件中导出多个类？
回答 3
Stack Overflow用户
发布于 2019-11-30 13:33:05
这是因为您在底部重新声明了类，所以可以像下面这样导出您的类。
export class Foo extends React.Component {
// your code
}
export class Bar extends React.Component {
// your code
}Stack Overflow用户
发布于 2019-11-30 13:41:59
您可以像往常一样声明您的类，然后导出文件末尾的所有类，如下所示
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 };或者，如果您愿意，也可以在声明类时将其导出。
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>;
}
}一般来说，建议每个文件只根据es-lint's rule导出一个组件。
Stack Overflow用户
发布于 2019-11-30 13:44:29
您还可以执行以下操作：
export Foo;
export Bar;而不是再次声明类。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/59113443
复制相关文章
相似问题
腾讯云开发者
