javascript - 在未识别的 native react 中导入 ES 模块

Question

我想将屏幕导入到我的 react 导航中，但是当我导入类 React.Component 时，它的身份不明

我的 routes.js

import * as Screens from '../screens/index';
import {FontIcons} from '../assets/icons';

export const MainRoutes = [
  {
    id: 'LoginMenu',
    title: 'Marketing',
    icon: FontIcons.login,
    screen: Screens.GridV1,
    children: [
      {
        id: 'Login1',
        title: 'Login V1',
        screen: Screens.GridV1,
        children: []
      },
      {
        id: 'Login2',
        title: 'Login V2',
        screen: 'GridV2',
        children: []
      },
      {
        id: 'SignUp',
        title: 'Sign Up',
        screen: 'GridV2',
        children: []
      },
      {
        id: 'password',
        title: 'Password Recovery',
        screen: 'GridV2',
        children: []
      },
    ]
  }
];

我的屏幕/index.js

export * from './navigation';
export * from './dash';

当我检查屏幕导入时

console.log(Screens);

一切都很好。但是当我执行

console.log(Screens.GridV1);

我无法访问 GridV1 类

请帮我解决这里的问题。谢谢你

Answer 1

从 Screens 的 chrome 快照，它显示那一刻你 console.log，Screens 对象只包含一个元素 {__esModule: true}。 GridV1、GridV2 和所有其他模块都延迟解决。

因此您应该看到它与 setTimeout 一起工作，例如:

setTimeout( () => console.log(Screens.GridV1), 100 );

但真正的问题还是隐藏在后面。通常 import javascript 模块不会有这样的副作用，它应该如您预期的那样工作。检查这些模块是否有特殊的初始化机制。