Question

我需要导出withTranslation和GoogleApiWrapper。

所以我在Details.js文件的末尾写了以下内容：

export default GoogleApiWrapper({
    apiKey: 'MY TOKEN'
})(Details);
export const SecondComponent = withTranslation()(Details);

结果证明这是行不通的，因为当我加载页面时，它向我显示了诸如“ t不是函数”之类的错误。

以前我只有：

   export default withTranslation()(Details);

那工作正常，但现在我正尝试使用Google API添加地图。

Answer 1

尝试不要混合导出默认值和导出const：

export const GoogleApiWrapper({apiKey: 'MY TOKEN'})(Details);
export const SecondComponent = withTranslation()(Details);

因此您可以这样导入它们：

import { GoogleApiWrapper, SecondComponent } from './dir/to/details';

Answer 2

最简单的答案是，你不能。

默认一词本身仅表示在任何给定上下文中，您都期望返回值的单一来源。您甚至不需要任何名称，因为您可以随意命名。

因此，总而言之，您不能有两个默认导出。从库或包中导入默认值时，问自己要选择哪个选项时，情况总是一样。

这是一个简短的备忘单，您可以看看：

// Name Export | Name Import
export const name = 'value'
import { name } from '...'


// Default Export | Default Import
export default 'value'
import anyName from '...'


// Rename Export | NameImport
export { name as newName }
import { newName } from '...'


// Name + Default | Import All
export const name = 'value'
export default 'defaultValue'
import * as anyName from '...' 

=> access by: anyName.name, anyName.default

// Name + Default | Import Mixing 
export const name = 'value'
export default 'defaultValue'
import default, { name } from '...' 

// Export List + Rename | Import List + Rename
export {
  name1,
  name2 as newName2
}
import {
  name1 as newName1,
  newName2
} from '...'
==> This is the devil dev, jk

与任何事物一样，没有正确或错误的答案。正确的方法永远是最适合您和您的团队的东西。

希望获得帮助

Answer 3

每个文件只能默认导出一个模块。创建另一个文件或使用命名的导出。

如何导出两个默认模块？

3 个答案: