React自定义PropTypes

liaoyg8023 发布于2019-08-21 15:34 / 2007人阅读

http://stackoverflow.com/ques...

// You can also specify a custom validator. It should return an Error
// object if the validation fails. Don"t `console.warn` or throw, as this
// won"t work inside `oneOfType`.
customProp: function(props, propName, componentName) {
  if (!/matchme/.test(props[propName])) {
    return new Error("Validation failed!");
  }
}

How type checkers work

function(props, propName, componentName, location, propFullName) => null | Error

PropTypes.number({ myProp: "bad" }, "myProp");
// => [Error: Invalid undefined `myProp` of type `string` supplied
//     to `<>`, expected `number`.]

PropTypes.number({ myProp: "bad" }, "myProp", "MyComponent", "prop")
// => [Error: Invalid prop `myProp` of type `string` supplied
//     to `MyComponent`, expected `number`.]


const minMaxPropType = (props, propName, componentName, ...rest) => {
  const error = PropTypes.number(props, propName, componentName, ...rest);
  if (error !== null) {
    return error;
  }

  if (props.min >= props.max) {
    const errorMsg = (propName === "min") ? "min should be less than max" : "max should be greater than min";
    return new Error(errorMsg);
  }
};

GPU云服务器云服务器自定义头像自定义网站自定义自定义按钮

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/88236.html

【全栈React】第8天: 属性类型

摘要：在大多数情况下，我们期望这些是一种特定类型或一组类型也称为或。例如，几天前我们构建的组件接受一个称为的属性，我们期望它是一个字符串。必需类型可以通过在任意个属性类型中附加中描述来将需要传递给一个组件根据需要设置是非常有用的。本文转载自：众成翻译译者：iOSDevLog链接：http://www.zcfy.cc/article/3818原文：https://www.fullstackr...

codeKK 2019-08-20 18:33 评论0 收藏0
React中组件通信的几种方式

摘要：首次发表在个人博客需要组件之进行通信的几种情况父组件向子组件通信子组件向父组件通信跨级组件通信没有嵌套关系组件之间的通信父组件向子组件通信数据流动是单向的父组件向子组件通信也是最常见的父组件通过向子组件传递需要的信息子组件向父组件通信利用 showImg(https://segmentfault.com/img/remote/1460000012361466?w=1240&h=667)...

yeooo 2019-08-21 18:00 评论0 收藏0
react开发教程（四）React数据流

摘要：在中，数据是自顶向下流动的称为单项数据流，从父组件传递到子组件。任何数据类型您还可以指定自定义类型检查器。如果检查失败，它应该返回一个对象。不要或，因为这不会在内工作。检查器有两个参数，第一个参数是数组或对象本身，第二个是当前项的键。在React中，数据是自顶向下流动的（称为单项数据流），从父组件传递到子组件。因此组件是简单且易于把握的，它们只需从父节点获取props渲染即可。如果顶...

CatalpaFlat 2019-08-20 15:57 评论0 收藏0
玩转 React（四）- 创造一个新的 HTML 标签

摘要：属性是一个组件的外部输入。只会在开发模式下进行属性类型检查，当代码进行生产发布后，为了减少额外的性能开销，类型检查将会被略过。某个类的实例枚举，属性值必须为其中的某一个值。属性为一个数组，且数组中的元素必须符合指定类型。在第二篇文章《新型前端开发方式》中有说到 React 有很爽的一点就是给我们一种创造 HTML 标签的能力，那么今天这篇文章就详细讲解下 React 是如何提供这...

soasme 2019-08-01 17:46 评论0 收藏0
玩转 React（四）- 创造一个新的 HTML 标签

摘要：属性是一个组件的外部输入。只会在开发模式下进行属性类型检查，当代码进行生产发布后，为了减少额外的性能开销，类型检查将会被略过。某个类的实例枚举，属性值必须为其中的某一个值。属性为一个数组，且数组中的元素必须符合指定类型。在第二篇文章《新型前端开发方式》中有说到 React 有很爽的一点就是给我们一种创造 HTML 标签的能力，那么今天这篇文章就详细讲解下 React 是如何提供这...

dendoink 2019-08-21 16:58 评论0 收藏0