zoukankan      html  css  js  c++  java
  • 使用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

  • 相关阅读:
    博客园设置简约主题
    day25-48
    day1-10
    drf app
    flask 框架 练习
    vue入门 显示数据 操作属性 操作样式 条件渲染
    flask 配置文件 路由 视图 模板 中间件
    flask 使用数据库连接池
    Android 工程中添加依赖
    apk反编译
  • 原文地址:https://www.cnblogs.com/kugeliu/p/7339077.html
Copyright © 2011-2022 走看看