Question

让我们说App组件由总线包装，总线导出为withBus。这是伪 ish 代码。

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  handleSomeEvent(e) {
    this.setState({ [e] });
  }

  render() {
    return ( ... );
  }
}

export default withBus(App);

此处，handleSomeEvent在App组件中定义。它调用setState。

包装组件（withBus）是否可以劫持/覆盖App的setState实例，以便App中对this.setState的每次调用都代理一个方法在withBus执行某些操作，然后在App上调用setState？

重点

应用程序不应该为此功能实现任何功能。

在这个例子中，目标是为setState添加功能而不会混淆反应的API。

Answer 1

是的，这完全有可能：

function withBus(C) {
    const orig = C.prototype.setState;
    C.prototype.setState = function() {
        // do whatever you want here
        return orig.apply(this, arguments);
    };
    return C;
}

是否有可能从包装组件中劫持/覆盖类原型方法？

1 个答案: