reactjs - 在某些组件中使用 HOC，而不是 Redux 中的每个组件

Question

首先，我已经将componentA，componentB，componentC连接到redux。其次，从 BackHandlerHoc 中导出 componentA

import React from 'react'
import { BackHandler,Platform} from "react-native";


export default function BackHandlerHoc(WrappedComponent) {
    return class extends React.Component {
        constructor(props) {
            super(props)
        }

        componentDidMount() {
            if (Platform.OS === "android") {
                BackHandler.addEventListener('hardwareBackPress', this.goBack.bind(this));
            }
        }

        componentWillUnmount() {
            if (Platform.OS === "android") {
                BackHandler.removeEventListener("hardwareBackPress", this.goBack.bind(this));
            }
        }


        goBack = () => {
            console.log("goBack")
            // some code
        };

        render() {
            return (
                <WrappedComponent {...this.props} />
            )
        }

    }
}

在组件 A 中

export default connect(mapStateToProps, null)(BackHandlerHoc(componentA))

在组件 B 中

export default connect(mapStateToProps, null)(componentB)

在组件C中

export default connect(mapStateToProps, null)(componentC)

问题是每个连接到 redux(componentB, componentC, componentA) 的组件都获取了 BackHandler.addEventListener。我只想让 componentA 获得 BackHandler.addEventListener。必须做什么？！

标签： reactjsreact-nativereduxreact-reduxhigher-order-components