使用PropTypes进行类型检测
PropTypes 是react提供的用于检验数据类型的typechecking,避免应用越来越大的时候出现意料之外的bug
class Greeting extends React.Component {
render() {
return (
<h1>Hello {this.props.name}</h1>
)
};
}
Greeting.propTypes = {
name: React.PropTypes.string.isRequired
};
使用方法如上,作用是检测该组件的使用者是否给name传入的值是字符串,并且该属性必填。
另外,可以通过枚举的方式来给属性指定几个特定的值
optionalEnum: React.PropTypes.oneOf(['News', 'Photos']),
指定optionalEnum属性只能是 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),
设置默认的属性值
// 如果name没有传值,则会将name设置为默认的zhangyatao
Greeting.defaultProps = {
name: 'zhangyatao'
}
当没有传入name这个属性的时候,name默认为zhangyatao
使用PropTypes进行类型检测的更多相关文章
- 【react】利用prop-types第三方库对组件的props中的变量进行类型检测
1.引言--JavaScript就是一个熊孩子 1.1对于JSer们来说,js是自由的,但同时又有许多让人烦恼的地方.javascript很多时候就是这么一个熊孩子,他很多时候并不会像C和java ...
- prop-types:该第三方库对组件的props中的变量进行类型检测
利用prop-types第三方库对组件的props中的变量进行类型检测
- 十分钟学习 react配套的类型检测库——prop-types的运用
js 有时在定义变量的类型为number 或string 时并不会报错,所以prop-types 是专门用来检测react ,以前的版本是把它放到react架构里面 ,现在作为一个独立的库搬出来了,跟 ...
- js类型检测总结
类型检测: 类和对象: Call,Apply,Bind
- javascript类型与类型检测
1.javascript类型: 注:包装对象:如"hello".length实际为js为我们隐式创建了一个String临时对象,去调用该对象的length属性,调用过后再将该临时对 ...
- 谈谈JavaScript类型检测
javascript内置的类型检测机制并非完全可靠.比如typeof操作符,并不能准确的判断数据是哪个类型,比如:数组和对象就不能通过typeof来区分. typeof [] ==="o ...
- JS数组类型检测
在强类型语言,数组类型检测是非常容易的事情(typeof就可以解决),而在弱语言JS数据类型就很容易混淆了. JS中常见的数据类型有:number.string.boolean.undefined.f ...
- 小结 javascript中的类型检测
先吐槽一下博客园的编辑器,太不好用了,一旦粘贴个表格进来就会卡死,每次都要用html编辑器写,不爽! 关于javascript的类型检测,早在实习的时候就应该总结,一直拖到现在,当时因为这个问题还出了 ...
- STUN: NAT 类型检测方法
STUN(Simple Transversal of UDP through NATs)[21]是RFC3489 规定的一种NAT 穿透方式,它采用辅助的方法探测NAT 的IP 和端口. STUN 的 ...
随机推荐
- linux的一些指令
linux的一些指令 █查看指令參數man 指令,如:man ls ,按q鍵退出 █查看文件列表ls -lht 按時間排序ll 列表ls 列表 目錄cd 目錄名稱 進入路徑cd .. 返回上層路徑 █ ...
- ES6 Reflect使用笔记
Reflect Reflect 对象和Proxy对象一样, 为操作对象提供了新的API. 为什么使用 Reflect的方式来操作对象? 将 Object 对象上一些明显属于内部的方法放到 Reflec ...
- LIS最长上升子序列模板
LIS n2解法: #include<iostream> #include<cstdio> using namespace std; int n,ans; ],f[]; int ...
- Apache 错误日志
配置文件中:httpd.conf ErrorLog "/usr/local/var/log/apache2/error_log1" CustomLog "/usr/loc ...
- Java中的接口和抽象类(转)
在面向对象的概念中,我们知道所有的对象都是通过类来描述的,但是并不是所有的类都是用来描绘对象的,如果一个类中没有包含足够的信息来描绘一个具体的对象,这样的类就是抽象类. 抽象类往往用来表征我们在对问题 ...
- 最小生成树:POJ1251-Jungle Roads(最小生成树的模板)
POJ 1251 Jungle Roads >[poj原址:http://poj.org/problem?id=1251](http://poj.org/problem?id=1251) Des ...
- 洛谷P1079 Vigenère 密码
题目链接:https://www.luogu.org/problemnew/show/P1079
- Centos7 使用 Supervisor 守护进程 Celery
一.Supervisor 安装(centos7 还有另一个进程守护命令 Systemd ) Centos 7 安装 Supervisord 二.Supervisor 守护进程 Centos7 使用 S ...
- CTF 两道web整数溢出题目(猫咪银行和ltshop)
①猫咪银行: (2018中科大hackgame) 一开始给十个CTB,而flag需要20个CTB,我们需要理财赚够20个. 理财是只能买入TDSU才可以获得收益.我们先上来直接把CTB全部换成TDSU ...
- jeakins配置邮件通知,附带解决535报错:authentication failed,如果发现测试邮件可以发出,项目构成无法发出邮件,请开启SSL认证,端口号改为(465),qq邮箱、163邮箱通用
535报错解决方案:调用163邮箱服务器来发送邮件,我们需要开启POP3/SMTP服务,这时163邮件会让我们设置客户端授权码,这个授权码替代上面代码部分的passwd即可成功发送邮件 如果设置的邮箱 ...