React组件间通信

React.Component和React.PureComponent区别：

PureComponent表示一个纯组件，可以优化React程序，减少render函数执行的次数，从而提高组件的性能。

在React中，当prop或者state发生变化时，可以通过在shouldComponentUpdate生命周期函数中执行return false来阻止页面的更新，从而减少不必要的render执行，React.PureComponent会自动执行shouldComponentUpdate。

优点：当组件更新时，若组件的props或者state都没有改变，render就不会触发。省去虚拟DOM的生成和对比过程，达到提升性能的目的，就是因为react自动做了一层浅比较。

组件通信：

父子组件的通信方式：

父组件向子组件通信：父组件通过props向子组件传递需要的信息。

子组件向父组件通信：props + 回调（子组件将想传给父组件的信息，作为参数传递到父组件中）

父组件：
class Parent extends Component{
callback(msg){
console.log(msg)
}
render(){
return <Child callback={this.callback.bind(this)}><Child/>
}
}

子组件：
const Child = props =>{
  const cb = msg =>{
      return ()=>{
          props.callback(msg)
      }
  }
  return (
      <button onClick={cb("hello!")}>你好</button>
  )
}

React-Router获取URL的参数和历史对象：

获取URL参数：
get传值 ：比如说传参方式'admin?id='111''，可以通过this.props.location.search获取URL中的一个字符串'?id='111''，然后可以根据方法解析出id的值。

动态路由传值：比如说'admin/111'，可以通过this.props.match.params.id取得URL中的动态路由id部分的值。

通过query或state传值：比如说{pathname:'/admin',query:'111',state:'111'}或者数组，可以通过this.props.location.state或this.props.location.query来获取，但是缺点是只要刷新页面，参数就会消失。

获取历史对象：

let history = this.props.history

在路由变化时重新渲染同一个组件：

当路由变化时，即组件的props发生了变化，会调用componentWillReceiveProps等生命周期钩子。也就是说，当路由改变时，根据路由，也去请求数据。

 componentWillReceiveProps(nextProps) {
     if (nextProps.location.pathname != this.props.location.pathname) {
         this.fetchData(nextProps.location);
     } 
  }