记录

• 组件创建方法

  • 工厂函数组件

  function MyComponent(){
    //return 虚拟DOM
    return '<h1></h1>'
  }
  

  -ES6类组件

  Class MyComponent extends React.Component {
    render(){
      return '<h1></h1>'
    }
  }
  

• React事件与HTML原生事件不同，比如onClick与onclick;

• this.handleClick = this.handleClick.bind(this);

  bind() 方法创建一个新的函数，在 bind() 被调用时，这个新函数的 this 被指定为 bind() 的第一个参数，而其余参数将作为新函数的参数，供调用时使用。

  即把原handleClick方法中的this用Component的实例this代替后赋值给handleClick,然后才能用来获取Component实例中的state；

• 当你遇到需要同时获取多个子组件数据，或者两个组件之间需要相互通讯的情况时，需要把子组件的 state 数据提升至其共同的父组件当中保存。之后父组件可以通过 props 将状态数据传递到子组件当中。这样应用当中所有组件的状态数据就能够更方便地同步共享了。

• 在 React 中，有一个命名规范，通常会将代表事件的监听 prop 命名为 on[Event]，将处理事件的监听方法命名为 handle[Event] 这样的格式。

• 每次只要你构建动态列表的时候，都要指定一个合适的 key，组件的 key 值并不需要在全局都保证唯一，只需要在当前的同一级元素之前保证唯一即可

开发小技巧

1. 通过在js代码中加入debugger来打断点