reactjs - ReactNative Importing with ...失败

Question

我有三个文件

1. Block.js使用 es6 import 导入数据，如下所示。

   /*
   COMPONENTS IMPORTS.
   */
   import BlockPill from '../../../components/block/pill.js'
   import BlockNavigation from '../../../components/block/navigation.js'
   import BlockFooter from '../../../components/block/footer.js'
   
   /*
   EXPORTS
   */
   module.exports = { BlockNavigation, BlockFooter, BlockPill }
   

2. instance.js如下所示导入 block.js 并使用扩展运算符导出。

   /*
   COMPONENT EXPORTING
   */
   import Blocks from './core/registration/block.js' // custom: @blocks component imports.
   
   /*
   EXPORTS.
   */
   module.exports = {
     // tags.
     ...Tags,
   
     // mods.
     ...Mods,
   
    // block.
    ...Blocks,
   
    // pages.
    ...Pages
   }
   

3. welcome.js导入实例并使用如下块。

   /*
   IMPORT START.
   */
   import Instance from '../../../system/instance.js' // custom: application component's store.
   
   let { BlockPill } = Instance || {}
   
   // component.
   <BlockPill />
   

结果：react-native 显示红色屏幕，显示以下消息。如果我删除而不是代码工作，否则失败。

消息： 不变违规：元素类型无效，预期字符串（对于内置组件）或类/函数（对于未定义的复合组件...

标签： reactjsreact-native

Answer 1

您将 es6 导入与以前版本的导出混合，所以我不确定，但您应该尝试：

import * as Block from './core/registration/block.js' // instance.js

import * as Instance from '../../../system/instance.js' // welcome.js

并按如下方式导出您的组件：

// block.js
export BlockNavigation;
export BlockFooter;
export BlockPill;