【React】心得以及项目问题汇总

zhongxia
2016-07-22 18:21:19

1. React使用心得

由于使用react, 都是一直使用 ES6的语法,  因此这里说的主要是针对ES6语法的一些心得. 

1. ES6中, 给标签 添加事件, 需要给函数 指定 this 对象, 否则函数内部的 this 对象会指向标签.
   eg:

<button onClick={this.handleClick.bind(this)}>Click Me!</button>

2. 组件内部有监听事件, 组件外部变量, 在组件卸载的时候, 需要移除监听, 清空比变量

let data = 'xxx';
class Demo extends React.Component {
    componentWillUnmount() {
      //TODO 卸载事件监听, 非React 组件内的变量 需要 设置为 null
      data = null;
    }
}

3. componentDidMount方法Ajax获取数据, 在 Ajax 成功的回调函数里面, 需要判断 that 是否为空, 不为空在做处理. (获取判断组件是否卸载)
   可能Ajax还没有请求结束的时候, 组件已经卸载了,导致

componentDidMount() {  
    let that = this;   
    //获取保存路径 
    Model.getSavePath(function (result) {   
        console.log("result.data", result.data) ; 
        that && that.setState({pathTreeSelectData: result.data}) 
 })}