发布于 

类组件中this指向(注)

只有类组件下有这个问题（函数组件没有this）

利用bind修改this指向组件：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
class HEL extends React.Comonent {
    num = 0;
    addNum() {
        this.num += 1;
        alert(this.num)
    }
    render () {
        return (
         <div>
           <h1 onClick={this.addNum.bing(this)}>数字加一</h1>   
         </div>
        )
    }
}

利用箭头函数方法（推荐）：该语法是实验性语法，由于babel的存在可以直接使用 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
class HEL extends React.Comonent {
    num = 0;
    addNum = () => {
        this.num += 1;
        alert(this.num)
    }
    render () {
        return (
         <div>
           <h1 onClick={this.addNum.bing(this)}>数字加一</h1>   
         </div>
        )
    }
}
许可协议

本文采用 署名-非商业性使用-相同方式共享 4.0 国际 许可协议，转载请注明出处。

快来参与讨论吧

本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。