react学习中的总结：验证传递的数据

1，验证父组件是否向子组件传递数据了，以及传递的数据类型，可以使用 prop-types - npm 

具体用法点击看详情吧。npm install --save prop-types

类组件中的使用例子：

import React, { Component } from 'react'
import PropTypes from 'prop-types'; // 引入传值验证的插件

export default class ButtonB extends Component {
  static propTypes = {
    //string: color是字符串类型；isRequired:color是必填的
    color: PropTypes.string.isRequired
  }
  // 设置默认的props
  static defaultProps = {
    color: 'blue'
  }
  render() {
    return (
      < div style={{border: '1px solid' + this.props.color}}>
        bbb
      </div>
    )
  }
} 

 函数组件中的例子：

import React from 'react'
import PropTypes from 'prop-types';

export default function ButtonC(props) {
  return (
    <div>
      我是按钮C{props.x}
    </div>
  )
}
ButtonC.propTypes = {
  x: PropTypes.number.isRequired
}
// 设置默认的props
ButtonC.defaultProps = {
  x: 3
}

还有很多其他的检测方式，详情看官网吧