父传子数据 props
FatherComponent.jsx
ChildComponent.jsx
父传子方法 props
FatherComponent.jsx
ChildComponent.jsx
带参数的方法：
FatherComponent.jsx
ChildComponent.jsx
父组件将自身传给子组件 props
FatherComponent.jsx
ChildComponent.jsx
父组件获取子组件的数据 refs
FatherComponent.jsx
ChildComponent.jsx
父组件获取子组件的方法 refs
FatherComponent.jsx
ChildComponent.jsx
带有参数的方法：
FatherComponent.jsx
ChildComponent.jsx
注意：ref绑定的ChildComponent必须是一个class组件，不能是个函数组件。因为React会给class创建组件实例，而不会给函数组件创建实例，你因此可以发现函数组件里没有用this进行实例属性定义。同时ref也可以绑定在普通的标签上面，所以证明了this.refs只是个普通对象，他既可以保存dom元素，也可以保存React组件的实例对象（class组件）
补充
官方实际已经不推荐使用字符串形式的ref（有问题，未来可能删除这个API），而是推荐使用回调ref。
即ref的值是一个回调函数，回调函数有一个element参数，element就是绑有ref属性的dom。
【上面介绍的通过ref来进行父子组件通讯，基本使用没有改变，只是把ref的绑定值进行了更改。】（不再通过this.refs来获取ref绑定的dom）
下面以表单text来进行演示：
进行化简后：
或者你还可以通过官方新增的API（React.createRef()），来使用ref (个人感觉这种最好理解)
与回调ref略微不同，获取dom是通过 this.textInput.current
你还可以通过props和ref结合使用，来获取多次嵌套的子组件中的标签元素，详细做法自行思考。
其实就是通过props把回调函数或者是ref对象（React.createRef()）传递下去。
组件的defaultProps和propTypes
defaultProps：用来初始化组件的props属性
ChildComponent.jsx
当父组件FatherComponent没有给子组件ChildComponent的props属性传递message参数值时，会使用default值 => message:’这里是默认信息’
如果有传，则会覆盖掉default值。
propTypes：对组件props属性中的值进行类型约束 （is propTypes no prototype）
ChildComponent.jsx
先导入react的依赖模块prop-types
这里对子组件ChildComponent的props属性中的message进行类型约束，message必须是个string，如果不是string则会报错