Files
react-navigation/packages/stack/example/src/LifecycleInteraction.js
2019-04-26 10:20:51 +02:00

73 lines
1.6 KiB
JavaScript

import * as React from 'react';
import { Button, Text, View, StyleSheet } from 'react-native';
import { BarCodeScanner } from 'expo';
import { withNavigationFocus } from '@react-navigation/core';
import { createStackNavigator } from 'react-navigation-stack';
const IndexScreen = ({ navigation }) => (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Button
title="Go to BarCodeScanner"
onPress={() => navigation.navigate('BarCode')}
/>
<Button
title="Return to other examples"
onPress={() => navigation.navigate('Home')}
/>
</View>
);
IndexScreen.navigationOptions = {
title: 'Lifecycle Interactions',
};
@withNavigationFocus
class BarCodeScreen extends React.Component {
handleBarCodeScanned = data => {
console.log('scanned...');
this.props.navigation.navigate('Info', { data });
};
render() {
return (
<View style={{ flex: 1 }}>
<BarCodeScanner
onBarCodeScanned={
this.props.isFocused ? this.handleBarCodeScanned : null
}
style={StyleSheet.absoluteFill}
/>
</View>
);
}
}
BarCodeScreen.navigationOptions = {
title: 'BarCodeView',
};
class InfoScreen extends React.Component {
render() {
return (
<View style={{ flex: 1 }}>
<Text>{JSON.stringify(this.props.navigation.getParam('data'))}</Text>
</View>
);
}
}
InfoScreen.navigationOptions = {
title: 'Info',
};
export default createStackNavigator(
{
Index: IndexScreen,
BarCode: BarCodeScreen,
Info: InfoScreen,
},
{
initialRouteName: 'Index',
}
);