为什么ES6 Reaction组件只与“export default”一起工作?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (7)

这个组成部分确实可以:

export class Template extends React.Component {
    render() {
        return (
            <div> component </div>
        );
    }
};
export default Template;

如果我移除最后一行,它就不工作了。

Uncaught TypeError: Cannot read property 'toUpperCase' of undefined

提问于
用户回答回答于

在一个文件中可以有多个命名导出。所以如果你这么做

export class Template {}
export class AnotherTemplate {}

然后,您必须使用它们的确切名称导入这些导出。所以要在另一个文件中使用这些组件,

import {Template, AnotherTemplate} from './components/templates'

或者,如果您作为default像这样出口,

export default class Template {}

然后在另一个文件中导入默认导出,而不使用{}像这样

import Template from './components/templates'

每个文件只能有一个默认导出。在Reaction中,从文件中导出一个组件是一种惯例,而导出它是默认的导出。

您可以在导入时重新命名默认导出,

import TheTemplate from './components/templates'

您可以同时导入默认和命名导出,

import Template,{AnotherTemplate} from './components/templates'

扫码关注云+社区