Question

我想知道是否有人可以帮助我了解React Native绑定的问题和含义。

我们构建了一个客户端应用程序，该应用程序具有多个视图和一个侧面导航-所有这些视图均使用此样式的语法来处理事件：

for

这是不正确的方法，可能导致内存泄漏，我应该使用绑定即-

<TouchableOpacity onPress={() => this.removephoto(key)}>

是以错误的方式绑定的东西会添加到具有重大意义的担忧列表中吗？或者这仅仅是最佳实践！？

我读过几篇文章-但大多数文章都是泥泞的-所以，请您从其中一位专家那里获得一些简单的英语解释。

Answer 1

所以我并不是真正的专家，但是这里有几件事要考虑：

组件生命周期可在the documentation

中找到

要记住的一点是，每次需要渲染组件时，都会调用render方法。这将导致所有子组件重新接收道具并触发其更新生命周期方法。

在当前代码中，lambda函数和bind都将创建一个新的函数对象。这通常不是问题，因为它很快完成。

确实会导致问题的地方是当您使用shouldComponentUpdate比较道具对象或使用PureComponent（用于类组件）或React.memo这样的内置HOC时。功能组件。如果您正在使用这些组件，则将它们传递给lambda或bound方法，这将使它们无论如何每次都重新渲染。

在特定情况下，如果TouchableOpacity是PureComponent，则不应将其传递给内联lambda或内联绑定函数。

如果您使用的是类组件，则应该这样做：

class MyComponent extends React.Component {

    constructor(props) {
       super(props);
       this.removephoto.bind(this);
    }

    removephoto(key) {
      //body
    }

    render() {
        return <TouchableOpacity onPress={this.removephoto}>;
    }

}

这将确保您始终使用相同的功能对象实例。

但是，如果TouchableOpacity不是纯组件，并且没有将函数传递给子纯组件，则无需执行此操作。

反应本机功能绑定（按钮）

1 个答案: