React学习之旅----defaultProps与propTypes

import React from 'react'
import PropTypes from 'prop-types';
class Header extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      title: '头部组件'
    }
  }
  getFather = () => {
    this.props.father.getData()
  }
  render () {
    return (
      <div>
        {/* 父组件给子组件传值：


    defaultProps:父子组件传值中，如果父组件调用子组件的时候不给子组件传值，可以在子组件中使用defaultProps定义的默认值

    propTypes：验证父组件传值的类型合法性

            1、引入import PropTypes from 'prop-types';

            2、类.propTypes = {
                name: PropTypes.string
            };


    都是定义在子组件里面 */}

        {/* /接受父组件传过来的title值 */}
        <h2>{this.props.title}</h2>
        <button onClick={this.props.run}>调用父组件的run方法</button>
        <button onClick={this.props.father.getData}>获取整个父组件</button>
        <button onClick={this.getFather}>执行父组件的方法</button>
        <button onClick={this.props.father.getChildData.bind(this, '我是子组件传递过来的值')}>子组件传递父组件的值</button>
        {this.state.title}
      </div>
    )
  }
}
//defaultProps   如果父组件调用子组件的时候不给子组件传值，可以在子组件中使用defaultProps定义的默认值
Header.defaultProps = {

  title: '标题'
}
Header.defaultProps = {
  title: '标题'
}
//同行propTypes定义父组件给子组件传值的类型

Header.propTypes = {

  num: PropTypes.number
}
export default Header