如何覆蓋React組件生命周期方法

Question

我想重寫react組件的生命周期（例如shouldComponentUpdate ），並在必要時調用默認的生命周期。 我嘗試從類似以下內容開始：

shouldComponentUpdate(nextProps, nextState) {
    return super.shouldComponentUpdate(nextProps, nextState);
}

但這行不通。 我想念什么？

Answer 1

我認為最好的方法是編寫es7裝飾器，您可以這樣寫：

function shouldComponentUpdate(nextProps, nextState) {
  //your custom shouldComponentUpdate function
}

function customShouldComponentUpdate(component) {
  component.prototype.shouldComponentUpdate = shouldComponentUpdate;
  return component;
}

感謝這個裝飾器，您可以在react component中重寫方法shouldComponentUpdate 。

用法示例：

@customShouldComponentUpdate
class Foo extends Component{
  //code
}