当前位置： 移动技术网 > IT编程>网页制作>CSS > propTypes与defaultTypes解析

propTypes与defaultTypes解析

2019年04月19日  | 移动技术网IT编程  | 我要评论

炫音13.7.7,奉旨沟女,国际qq

proptypes：

为防止父给子组件传递的参数不是子组件期望的参数类型而导致程序运行错误，在子组件中可以对父组件传递过来的参数进行校验，使用的就是proptypes。

使用方法：

import proptypes from 'prop-types';

class greeting extends react.component {
  render() {
    return (

hello, {this.props.name}

); } } greeting.proptypes = { name: proptypes.string };

引入proptypes，调用组件proptypes属性对参数进行校验。proptypes导出一系列验证器，可用于确保您收到的数据有效。在这个例子中，我们正在使用proptypes.string（要求参数是字符串类型的）。如果为prop提供了无效值，则会在javascript控制台中显示警告。出于性能原因，proptypes仅在开发模式下进行检查。

验证器还有：

proptypes.array proptypes.bool proptypes.func proptypes.number proptypes.object proptypes.symbol proptypes.node proptypes.element proptypes.instanceof(类名) proptypes.oneof([可选值列表]) proptypes.oneoftype([proptype.string,....]):许多类型中的一种 proptypes.arrayof([]);可以是哪些类型 proptypes.objectof();具有特定类型的属性值的对象 链式操作表示此参数是必须的：eg：proptypes.array.isrequired表示此参数为一个数组类型的且必须存在

defaultprops:

defaultprops：为参数定义默认值

class greeting extends react.component {
  render() {
    return (

hello, {this.props.name}

); } } // specifies the default values for props: greeting.defaultprops = { name: 'stranger' }; // renders "hello, stranger": reactdom.render( , document.getelementbyid('example') );

为name定义默认值为字符串stranger当父组件没有向子组件传递name属性值时name为默认值。

所以类型检查也将适用于defaultprops。

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网