必须将呈现道具、呈现函数指定为子项，或指定为 Field(auto) 的组件道具

Question

我在使用final-form开发Auto complete时遇到错误

必须指定渲染道具、作为子级的呈现函数或 Field (auto( 的组件道具

我从此链接获得帮助 https://trejgun.github.io/articles/bindings-for-using-final-form-with-material-ui-autocomplete/

但是当我实现上面的代码时，我得到了上面的错误

这是我的代码 https://codesandbox.io/s/relaxed-breeze-hv58o

<Field
name="auto"
multiple={true}
component={AutoCompleteWrapper}
placeholder="First Name"
options={[{ label: "The Shawshank Redemption", values: 1994 }]}
/>

Answer 1

在代码沙箱中，在 test.js 中，您将AutoCompleteWrapper导出为命名导出：

export const AutoCompleteWrapper = props => {

但是在您的 index.js 文件中，您将其作为默认值导入：

import AutoCompleteWrapper from "./test";

因此，您可以通过以下两种方式之一解决此问题：

导入指定的导出

import { AutoCompleteWrapper } from "./test";

将导出更改为默认导出

const AutoCompleteWrapper = props => {
...
};
export default AutoCompleteWrapper;