React InstantSearch Dropdown RefinementList不工作:应为字符串或类/函数(用于复合组件)，但得到:未定义

Question

我正在尝试使用this guide来创建一个下拉列表，而不是默认的。我首先创建了一个带有contents form here的Dropdown.js

import React, { Component } from 'react';
import { connectRefinementList } from 'react-instantsearch/connectors';
import PropTypes from 'prop-types';

const cx = label => `ais-DropdownRefinementList-${label}`;
/// Rest of the code from the above link follows
export default connectRefinementList(DropdownRefinementList);

然后我将其导入到我的search.js组件中，该组件构建我的接口，如下所示：

import { DropdownRefinementList} from "./Dropdown"

像这样使用它：

<DropdownRefinementList attribute="major" />

这会给我以下错误：

×
Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `SearchGrid`.

SearchGrid只是我的搜索组件。当我删除<DropdownRefinementList attribute="major" />时，这个问题就消失了，所以这就是问题所在。

我的实现有什么问题吗？我该如何解决这个问题呢？

Answer 1

应该是import DropdownRefinementList from "./Dropdown"

这是因为您要从Dropdown.js文件中导出default。