JavaScript 类之间的 React Native 变量

Question

我正在尝试使用 react-navigation 设置导航操作，但我遇到了麻烦，因为我使用 FlatList 和 Pure Component 来呈现列表中的项目。该列表呈现良好，但是当我尝试将 onPress 函数添加到 TouchableHighlight 时，我无法调用正常的导航函数，因为它不知道变量导航的含义。如果可能，我想保留纯组件的单独文件，而不是将其移动到另一个 class。

纯组分：

export default class Lot extends React.PureComponent {

    render() {
        return (
            <TouchableHighlight
                onPress={() => navigate('LotView')}
            >
                <View style={{ flex: 1, height: 150, alignItems: 'center', justifyContent: 'center' }}>
                    <View>
                        {this.props.active && (<Image source={images[this.props.index]} style={[styles.images]} />)}
                    </View>

                 </View>

            </TouchableHighlight>
        );
    }
}

以下是我的App.jsclass.

平面列表

<FlatList
    data={this.state.lots}
    renderItem={({ item }) => <Lot {...item} />}
/>

导航屏幕

export const MyApp = StackNavigator({
    Home: { screen: HomeScreen },
    LotView: { screen: LotView },
});

Answer 1

批次应该是虚拟组件（不应有任何外部访问权限）

export default class Lot extends React.PureComponent {

    render() {
        return (
            <TouchableHighlight
                onPress={this.props.onPress} // <== CHANGED
            >
                <View style={{ flex: 1, height: 150, alignItems: 'center', justifyContent: 'center' }}>
                    <View>
                        {this.props.active && (<Image source={images[this.props.index]} style={[styles.images]} />)}
                    </View>

                 </View>

            </TouchableHighlight>
        );
    }
}

主屏幕

<FlatList
    data={this.state.lots}
    renderItem={({ item }) => <Lot {...item} onPress={() => this.props.navigate('LotView')} />} //<== CHANGED
/>

JavaScript 类之间的 React Native 变量

React Native variables between JavaScript classes

javascript

react-native

react-native-flatlist

JavaScript 类 之间的 React Native 变量

React Native variables between JavaScript classes

javascript

react-native

react-native-flatlist

JavaScript 类之间的 React Native 变量