React PropType检查动态对象

Question

我最初有一个空对象。

const foo = {};

它将变成

const foo = {
 a: 'data',
 b: 'data',
 .
 .
 nth
};

如何为此定义PropTypes或为此需要自定义类型检查器？

Answer 1

您可以这样使用：

对象的所有值都应具有String的实例：

foo: PropTypes.objectOf(PropTypes.string),

进一步的兴趣：

可以传递对象的任何值：

foo: PropTypes.objectOf(PropTypes.any),

对象只能具有a和b作为其属性：

foo: PropTypes.shape({
    a: PropTypes.string,
    b: PropTypes.number
}),

或者，自定义验证：

foo: function(props, propName, componentName) {
    if (!/matchme/.test(props[propName])) {
      return new Error(
        'Invalid prop `' + propName + '` supplied to' +
        ' `' + componentName + '`. Validation failed.'
      );
    }
  },

Answer 2

这实际上取决于您是否希望您的对象是强类型的。JS 可以非常自由地处理对象类型，或者您可以使用类似 typescript 的东西来使所有内容都成为强类型。

我不完全确定自定义类型检查器的含义，但如果说这是由外部事物填充的，并且您始终希望对象中的变量为 int 类型，那么您可以添加一些逻辑来执行此操作。

如果您对整个问题更准确，也许我可以进一步帮助您