我正在阅读《Thinking in React》文档:https://facebook.github.io/react/docs/thinking-in-react.html
文档最后部分https://facebook.github.io/react/docs/thinking-in-react.html#step-5-add-inverse-data-flow ,我无法理解bind(this)的使用以及它是如何工作的。具体来说,我试图理解:
为什么我们在 SearchBar 组件中需要这两行:
this.handleFilterTextInputChange = this.handleFilterTextInputChange.bind(this);
this.handleInStockInputChange = this.handleInStockInputChange.bind(this);
FilterableProductTable 组件中的以下两行:
this.handleFilterTextInput = this.handleFilterTextInput.bind(this);
this.handleInStockInput = this.handleInStockInput.bind(this);
如果我们不进行这些绑定(bind)会发生什么?
我已经阅读了 JavaScript 绑定(bind)函数的文档以及我在 Google 上找到的一些关于反向数据流的示例,但仍然无法理解它。
如果有人可以解构数据流以及什么this
,我将不胜感激在每个实例中都指的是。
最佳答案
bind
调用返回一个新函数,该函数将调用绑定(bind)函数,并将 this(上下文)设置为给定值。如果您进一步遵循该示例,您会发现这两个函数作为回调方法/事件处理程序提供给子组件。
如果没有绑定(bind),子组件必须确保使用正确的上下文(其父组件)调用回调。这会不必要地耦合这些组件,并给开发人员带来沉重负担,让他们不能忘记这一点。
如果父组件将回调绑定(bind)到自身,它可以确保子组件(应该使用回调)不必知道这一点,只需调用回调即可。
关于javascript - React中反向数据流中bind(this)的使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42427893/