以箭头函数格式使用react的生命周期方法的优缺点

Question

我正在使用公共类字段语法(handler = () => {...})来定义我的所有React组件的事件处理程序,以便我可以使用this我的组件而不将它们绑定在constructor.我想知道我可以使用这种语法来使用React生命周期方法吗？用componentWillMount这种方式说:componentWillMount = () => {...}

如果使用箭头函数定义react的生命周期方法有什么优缺点？

Answer 1

每次您的函数执行=>操作时，它都必须创建一个新的函数对象。这可以防止浏览器在渲染同一元素的多个副本时重用相同的功能，这使得 javascript 引擎的优化变得更加困难。这会导致性能问题（但在大多数程序中，它不会引起注意）。

建议不要在 React 中的生命周期方法中使用箭头函数

什么时候应该使用箭头函数

Answer 2

组件生命周期方法中不应该需要隐式绑定this(即:使用箭头函数).它们总是从组件的上下文中调用,因此对props,state,getState等的访问已经可用.

所以这种模式没有任何优势.我能想到的一些缺点是:

1. 更详细的语法仍然只是一个ECMAScript提案.
2. 困惑其他合作者.如果您this对组件方法进行绑定,我立即期望下游的其他实体将调用它,即:单击从父级传递给子级的事件处理程序.