控制台警告由于通过Formik字段将其他无关道具传递给材料ui自动完成

Question

我收到的警告是

我正在附加一个代码沙箱链接，以重现此警告。有人可以解释为什么发生此警告以及如何消除此警告： https://codesandbox.io/s/cool-bogdan-6lyxs?file=/src/App.js

Answer 1

警告实际上与formik字段无关，而是与FormikAutocomplete组件的实现有关。

在FormikAutocomplete中，您正在破坏道具：

const FormikAutocomplete = ({ textFieldProps, ...props }) => { ...

因此，props对象将包含istesting值的true和test的{​​{1}}。您不只是将testFunc对象散布到实体uis props组件的props中，该组件不知道如何处理这些props，可能会将它们传递给呈现的html元素（一个div在这种情况下）。您的浏览器要抱怨Autocomplete上的这些道具，因为它们不属于那里。

解决方法是仅将由它们正确处理的那些道具传递到div，或者将这些道具从您的Autocomplete对象中解构出来，而不应该传递。

例如，您可以将props中的代码更改为

FormikAutocomplete