javascript - 如何指定 proptypes 以允许可为空的、必需的 prop 值？

Question

对于我的项目，希望在组件属性中传递 null 值以指示未指定的值(“已知未知”，如果您愿意的话)。以这种方式使用 null 是我们团队的惯例。

通过组件 propTypes 定义，我想要求为 prop 传递一个值，但允许它为 null(不是未定义)，而 React prop 类型验证不会触发警告。

所以以 i/o 风格重申一下:

• prop value = string/number/object/etc --> 无警告
• prop value = null --> 无警告
• prop value = undefined(显式或仅省略 prop 值分配)--> warning

如何实现这种行为？

一个想法是写一些替代 .isRequired 的东西，比如 .isDefined，它不会对空值发出警告，但我不知道如何在不 fork 或放弃 prop-types 库的情况下做到这一点。

Answer 1

我不确定你是否能让它以可链接的方式工作(我已经考虑了大概两分钟)，但也许你可以使用自定义验证器？

function allowNull(wrappedPropTypes) {
  return (props, propName, ...rest) => {
    if (props[propName] === null) return null;
    return wrappedPropTypes(props, propName, ...rest);
  }
}

MyComponent.propTypes = {
  nullOrNumber: allowNull(PropTypes.number.isRequired)
};