Javascript 测试时，导入返回未定义的组件，而不是react组件 我正在为我的应用程序创建测试，并且在笑话中运行它们有问题。我的代码结构如下所示：

/src/
├── 行动
│   ├── departments.js
│   ├── departments.test.js
├── 动作类型
│   ├── departmentsTypes.js
├── 组件
│   ├── 常见的
│   │   ├── 形式
│   │   │   ├── Form.css
│   │   │   ├── FormElement
│   │   │   │   ├── FormElement.css
│   │   │   │   ├── FormElement.js
│   │   │   │   ├── FormElement.test.js
│   │   │   │   └── __快照__
│   │   │   ├── Form.js
│   │   │   ├── Form.test.js
│   │   │   ├── index.js
│   │   │   └── __快照__
│   │   │       └── Form.test.js.snap
│   │   ├── index.js
│   │   ├── 图式工厂
│   │   │   ├── SchemaFormFactory.js
│   │   │   ├── SchemaFormFactory.test.js
│   │   │   └── __快照__
│   │   │       └── SchemaFormFactory.test.js.snap
│   │   └── 文本输入框
│   ├── 部门选择器
│   │   ├── DepartmentSelector.css
│   │   ├── DepartmentSelector.js
│   │   ├── DepartmentSelector.test.js
│   │   ├── index.js
│   │   └── __快照__
│   ├── index.js
│   ├── 主控制程序
│   │   ├── index.js
│   │   ├── MainApp.css
│   │   ├── MainApp.js
│   │   ├── MainApp.test.js
│   │   └── __快照__
├── 容器
│   ├── 部门表格
│   │   └── DepartmentForm.js
│   ├── 部门研究
│   │   ├── DepartmentsSearch.js
│   │   ├── DepartmentsSearch.test.js
│   │   ├── index.js
│   │   └── __快照__
├── 助手
│   └── test-helper.js
├── index.js
├── 还原剂
│   ├── departments.js
│   ├── departments.test.js

您的

部门搜索

没有

render（）

方法，并且没有返回任何内容（因此为“未定义”）

---

您至少需要通过

render（）

返回一些内容，无论是子节点、

false

还是

null

。否则，应用程序的其余部分不知道如何处理组件。

问题在于如何导入依赖项。在这种情况下，

DepartmentSelector

导入一个

FormElement

和

FormElement

导入

DepartmentSearch

（我们的容器）。因为节点不知道如何导入依赖项（递归依赖项），所以它只返回一个错误。它在web浏览器中工作，因为webpack可以很好地处理递归依赖项，并从代码中提取它们。解决这个问题的最简单方法是在测试文件的顶部导入

DepartmentSearch

//DepartmentSelector.test.js
从“../../containers/DepartmentSearch/DepartmentSearch”导入DepartmentSearch“

DepartmentSearch

是一个增强

DepartmentSelector

的容器，其中包含部分

redux

状态和操作创建者。它不应该有渲染，因为

DepartmentSelector

有。就像我说过的，这不是代码本身的问题，而是运行测试的问题，因为整个代码在浏览器中都可以很好地执行。只有在运行测试时，才会出现错误

不变量冲突：必须将组件传递给connect返回的函数。而是接收到未定义的

。