React设置PropTypes同时满足类型和必填，有没有不用自定义校验器的简便方法？

解决方案 #

你不需要自定义校验器，直接使用PropTypes内置的链式调用语法即可实现同时校验数字类型+必填：

ShopxItem.propTypes = {
  // 链式调用同时满足「数字类型」+「必填」两个规则
  price: PropTypes.number.isRequired,
  // 其他prop的校验可以参考这个写法，比如name要必填字符串：
  name: PropTypes.string.isRequired
}

原写法错误原因 #

你之前的写法重复声明了对象的price属性，JS对象不允许存在同名键，所以才会触发Duplicate Key报错，且后声明的属性会覆盖前一个。

补充说明 #

• 所有PropTypes内置的基础校验器（number/string/bool/array/object等）都支持.isRequired链式调用，标记该prop为必填项
• 不符合校验规则时会自动在控制台输出标准化的错误提示，不需要手动编写自定义校验逻辑

内容的提问来源于stack exchange，提问作者Mwt_0239