react+propTypes
React.createClass({
propTypes: {
// 可以声明 prop 为指定的 JS 基本数据类型,默认情况,这些数据是可选的
optionalArray: React.PropTypes.array,
optionalBool: React.PropTypes.bool,
optionalFunc: React.PropTypes.func,
optionalNumber: React.PropTypes.number,
optionalObject: React.PropTypes.object,
optionalString: React.PropTypes.string,
// 可以被渲染的对象 numbers, strings, elements 或 array
optionalNode: React.PropTypes.node,
// React 元素
optionalElement: React.PropTypes.element,
// 用 JS 的 instanceof 操作符声明 prop 为类的实例。
optionalMessage: React.PropTypes.instanceOf(Message),
// 用 enum 来限制 prop 只接受指定的值。
optionalEnum: React.PropTypes.oneOf(['News', 'Photos']),
// 可以是多个对象类型中的一个
optionalUnion: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.number,
React.PropTypes.instanceOf(Message)
]),
// 指定类型组成的数组
optionalArrayOf: React.PropTypes.arrayOf(React.PropTypes.number),
// 指定类型的属性构成的对象
optionalObjectOf: React.PropTypes.objectOf(React.PropTypes.number),
// 特定 shape 参数的对象
optionalObjectWithShape: React.PropTypes.shape({
color: React.PropTypes.string,
fontSize: React.PropTypes.number
}),
// 任意类型加上 `isRequired` 来使 prop 不可空。
requiredFunc: React.PropTypes.func.isRequired,
// 不可空的任意类型
requiredAny: React.PropTypes.any.isRequired,
// 自定义验证器。如果验证失败需要返回一个 Error 对象。不要直接使用 `console.warn` 或抛异常,因为这样 `oneOfType` 会失效。
customProp: function(props, propName, componentName) {
if (!/matchme/.test(props[propName])) {
return new Error('Validation failed!');
}
}
},
/* ... */
});
react+propTypes的更多相关文章
- 关于React.PropTypes的废除,以及新版本下的react的验证方式
React.PropTypes是React用来typechecking的一个属性.要在组件的props上运行typechecking,可以分配特殊的propTypes属性: class Greetin ...
- react PropTypes 与 DefaultProps
PropTypes 与 DefaultProps import React ,{ Component } from 'react'; import PropTypes from 'prop-types ...
- [React] Remove React PropTypes by using Flow Annotations (in CRA)
Starting from v15.5 if we wanted to use React's PropTypes we had to change our code to use a separat ...
- react Props 验证 propTypes,
<body><!-- React 真实 DOM 将会插入到这里 --><div id="example"></div> <!- ...
- React组件属性部类(propTypes)校验
React组件属性类型(propTypes)校验 Prop 验证 随着应用不断变大,保证组件被正确使用变得非常有用.为此我们引入propTypes.React.PropTypes 提供很多验证器 (v ...
- React中的PropTypes详解
propTypes用来规范props必须满足的类型,如果验证不通过将会有warn提示. React PropTypes的种类有: React.PropTypes.array // 队列 React.P ...
- 正式学习React(五) Reactjs 的 PropTypes 使用方法
propTypes 使用來規範元件Props的型別與必需狀態 var Test = React.createClass({ propTypes: { // required requiredFunc: ...
- 【react】利用prop-types第三方库对组件的props中的变量进行类型检测
1.引言--JavaScript就是一个熊孩子 1.1对于JSer们来说,js是自由的,但同时又有许多让人烦恼的地方.javascript很多时候就是这么一个熊孩子,他很多时候并不会像C和java ...
- React的类型检测PropTypes
React.propTypes:React.PropTypes 提供很多验证器来验证传入数据的有效性,当向props传入无效数据时,JavaScript 控制台会抛出警告. ; class MyTit ...
随机推荐
- Python3 集合
1.集合的表示 集合是一个无序不重复的元素序列 创建空集合 set() 2.集合的运算 a={1,2,3} b={2,3,4} print(a-b) #a中包含b中不包含 print(a|b) #a中 ...
- 微信小程序如何获取openid
微信小程序如何获取openid wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, unionId // ...
- Python基础1 Hello World!
从今天开始和大家分享一下python最基础的知识,以便帮助初学者快速入门. 最最基础的当然是hello world 了,无论哪门语言都会从它开始... 简单的‘Hello World!’ 1. 直接运 ...
- 自定义类属性设置及setter、getter方法的内部实现
属性是可以说是面向对象语言中封装的一个体现,在自定义类中设置属性就相当于定义了一个私有变量.设置器(setter方法)以及访问器(getter方法),其中无论是变量的定义,方法的声明和实现都是系统自动 ...
- win7 x64+iis7.5 配置错误:CS0016: 未能写入输出文件“c:\Windows\Microsoft.NET\Framework64\v4.0.30319\Temporary ASP.NET Files\root\7cb4f3
解决方法: 1. 将windows/temp属性-安全-高级 添加IIS_USERS用户,同时编辑权限为完全控制(写入和编辑)即可. 注意: 要确保权限添加上了,win7下有可能系统为安全,会自动取消 ...
- PokeCats开发者日志(十二)
现在是PokeCats游戏开发的第六十一天的晚上,终于拿到软著权登记证书了! 看来易版权确实是个值得信赖的代办机构呢,400块花的不冤.
- PAT 甲级 1101 Quick Sort
https://pintia.cn/problem-sets/994805342720868352/problems/994805366343188480 There is a classical p ...
- 最近面试前端面试题整理(css部分)
对最近面试的面试题坐下总结: 一,css部分 1,html元素的垂直居中 答案: <div id="box"> <div> 测试 </div> ...
- MySQL event调度
基本命令 //查看事件调度是否开启 show variables like '%event_scheduler%'; //开启事件调度 SET GLOBAL event_scheduler = ON; ...
- window service 创建
1:vs中创建一个 window servece 2.右键 添加安装程序 3.更改属性视图中的Account属性为LocalService(本地服务) 更改ServiceName为你自己的服务名称 ...