Files
react-navigation/Example/navigationTabsAndStack.js
Lorenzo Sciandra c590283359 Enhancement: change to useScreens to enableScreens (#99)
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.
2019-10-11 21:57:48 +02:00

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, {}));