mirror of
https://github.com/zhigang1992/react-navigation.git
synced 2026-01-27 22:28:21 +08:00
This wants to be a small PR to improve the usability of the library, based on this conversation: https://twitter.com/grifotv/status/1127847192067215360. Since the release of RNS there has been a new major player in the React game: hooks. And sadly `useScreens` recalls too closely Hooks, and this can lead to misunderstanding. Changing it to `enableScreens` will make the difference clear, but at the same time it will be a BREAKING CHANGE for everyone using the lib. So if we prefer to keep it around as useScreens I'm ok with it too, and we can close this. Also, I did some tweaks to the README + fix some typos.
43 lines
1.1 KiB
JavaScript
43 lines
1.1 KiB
JavaScript
import * as React from 'react';
|
|
import { Text, View, StyleSheet, Button } from 'react-native';
|
|
import { enableScreens } from 'react-native-screens';
|
|
import {
|
|
createAppContainer,
|
|
createStackNavigator,
|
|
createBottomTabNavigator,
|
|
} from 'react-navigation';
|
|
|
|
enableScreens();
|
|
|
|
class DetailsScreen extends React.Component {
|
|
static navigationOptions = ({ navigation }) => {
|
|
return {
|
|
title: 'Details screen #' + navigation.getParam('index', '0'),
|
|
};
|
|
};
|
|
render() {
|
|
const index = this.props.navigation.getParam('index', 0);
|
|
return (
|
|
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
|
|
<Button
|
|
title={'More details ' + index}
|
|
onPress={() =>
|
|
this.props.navigation.push('Details', {
|
|
index: index + 1,
|
|
})
|
|
}
|
|
/>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
const Scenes = {
|
|
A: createStackNavigator({ DetailsScreen }),
|
|
B: createStackNavigator({ DetailsScreen }),
|
|
C: createStackNavigator({ DetailsScreen }),
|
|
D: createStackNavigator({ DetailsScreen }),
|
|
};
|
|
|
|
export default createAppContainer(createBottomTabNavigator(Scenes, {}));
|