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

Question

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

我记得随着时间的推移，我读过一些文章，如果 3rd 方库缺少 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,
}

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

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

当我的代码没有按要求指定它们时，我不明白为什么它会显示 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,
}

您将道具设置为对象，并且将它们的值设置为未定义。你为什么这样做？

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

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

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

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

希望有帮助！