当我指定了它们的错误内容时，为什么我会收到这些 React PropType 错误？

Question

我有一个与 Apollo Client 和 Redux-Form 连接的编辑表单组件，我还安装了 prop-types。

我记得我读过的一些书，如果第 3 方库缺少 proptypes，或者如果我的某些父组件没有正确使用 prop-types，它们有时会抛出这类消息。

不过我很难推理它，因为我不知道该去哪里找，也不知道为什么要找。

这是错误的屏幕截图，一张来自 Apollo，一张来自 Redux-Form：

但是，

我在此视图上声明了道具类型：

PersonEdit.propTypes = {
  ... ✂
  client: PropTypes.shape(PropTypes.any),
  initialValues: PropTypes.shape(PropTypes.object),
}

PersonEdit.defaultProps = {
  ... ✂
  client: undefined,
  initialValues: undefined,
}

我也试过在其中包含 isRequired：

PersonEdit.propTypes = {
  ... ✂
  client: PropTypes.shape(PropTypes.any).isRequired,
  initialValues: PropTypes.shape(PropTypes.object).isRequired,
}

谁能帮我理解这些 prop 类型相关错误的性质？

我非常强烈地感觉到我以前读过这个，它可能涉及一些 "parent" 逻辑或在视图之前调用的东西，但我不清楚如何弄清楚。

我不明白为什么它说 initialValues.isRequired 或 client.isRequired 而我的代码 没有按要求指定它们.

哦，这是我对这个编辑表单的导出，因为我觉得它有可能是相关的：

export default compose(
  connect(mapStateToProps, {
    onServerError,
    getPerson,
    onBackPress,
  }),
  // graphql(PERSON_EDIT_MUTATION),
  reduxForm({
    validate,
    form: 'PersonEdit',
    enableReinitialize: true,
  }),
)(withApollo(PersonEdit))

我只是在 componentWillMount 和 componentDidMount 运行期间尝试重新混合代码并删除各种内容，然后我注释掉了所有内容以触发 NotFoundPage 组件而不是编辑表单，它仍然会产生相同的错误。

如果我注释掉 propTypes 和 defaultProps 声明，错误就会消失，所以它与它们有某种关系。

Answer 1

你的问题肯定与这段代码有关

PersonEdit.defaultProps = {
  ... ✂
  client: undefined,
  initialValues: undefined,
}

您正在将 props 设置为对象，并将它们的值设置为 undefined。为什么要这样做？

只需将其设置为类似（或任何未定义的）

PersonEdit.defaultProps = {
  ... ✂
  client: null,
  initialValues: null,
}

另外，为什么要这样设置类型检查？为什么要使用 any 和 object inside 形状？你可以这样写

PersonEdit.propTypes = {
  ... ✂
  client: PropTypes.any.isRequired,
  initialValues: PropTypes.object.isRequired,
}

希望对您有所帮助！

当我指定了它们的错误内容时，为什么我会收到这些 React PropType 错误？

Why am I getting these React PropType errors when I have specified what they are erroring about?

apollo

reactjs

redux-form

react-proptypes