0

我有一个 React 项目，我通过一个文件保持所有组件可用，所以不要这样做

import Foo from "./Foo.js"
import Bar from "./Bar.js"

我有一个components.js-file

export Foo from "./Foo.js"
export Bar from "./Bar.js"

所以我可以

import { Foo, Bar } from "./components.js"

我的问题是Foo,Bar和我以这种方式导入的任何其他内容都是undefined针对第一个“事件队列”的，也就是说，如果我有这个文件

import { Foo, Bar } from "./components.js"

console.log("FOO1", !!Foo, !!Bar)
window.setTimeout(() => {
    console.log("FOO2", !!Foo, !!Bar)
}, 0)

它会输出

FOO1 false false
FOO2 true true

对于普通的 React 组件（函数或类），这并没有造成任何问题，但是当我尝试使用 Redux 的connect-function 创建容器组件时，它会抱怨输入为undefined. 我猜这是因为当我声明 React 组件时，引用并没有直接引用，但是当我调用connect-function 时，它会立即尝试访问该组件并看到它是undefined. 不过，这只是我未受过教育的假设。

为什么会发生这种情况，我该如何预防？我认为这可能是 Stage 1 transform-export-extensions plugin的问题，但我使用了不同的语法 - 例如export const Foo = require("./Foo").default- incomponents.js并且问题仍然存在。

4

0 回答 0