沐鳴總代_react性能優化之bind(this)

沐鳴測速

bind在react組件中使用不當也會影響性能
bind在render裏面直接onClick = this.onClick.bind(this)
這樣寫的話，render每次都會執行這段

1、優化方案,使用箭頭函數

class Test extends react.Component {
    click = () => {}
    render() {
        return (<>
            <button onClick={this.click}></button>
        </>)
    }
}

2、優化方案，在construt 里使用


class Test extends react.Component {
    constructor() {
        this.click = this.click.bind(this);
    }
    click = function() {}
    render() {
        return (<>
            <button onClick={this.click}></button>
        </>)
    }
}

站長推薦

1.雲服務推薦: 國內主流雲服務商，各類雲產品的最新活動，優惠券領取。地址：阿里雲騰訊雲華為雲

2.廣告聯盟: 整理了目前主流的廣告聯盟平台，如果你有流量，可以作為參考選擇適合你的平台點擊進入

鏈接: http://www.fly63.com/article/detial/8819