-1
App.js
import React from 'react';
import { StatusBar } from 'react-native';
// Importação das rotas
import Routes from './src/routes';
export default function App() {
return (
<>
<StatusBar barStyle="light-content" backgroundColor="#7d40e7"></StatusBar>
<Routes></Routes>
</>
);
}
Main.js
import React, { useEffect } from 'react';
import { StyleSheet } from 'react-native';
import MapView from 'react-native-maps';
function Main() {
useEffect(() => {
async
}, []);
return <MapView style={styles.map}></MapView>
}
const styles = StyleSheet.create({
map: {
flex: 1 //mapa ocupa a tela inteira
},
});
export default Main;
Profile.js
import React from 'react';
import { View } from 'react-native';
function Profile() {
return <View></View>
}
export default Profile;
routes.js
import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
// Importação das páginas da aplicação
import Main from './pages/Main';
import Profile from './pages/Profile';
const Routes = createAppContainer(
createStackNavigator({
Main: {
screen: Main, //qual componente será renderizado
navigationOptions: { //opções específicas dessa tela
title: 'DevRadar'
}
},
Profile: {
scree: Profile,
navigationOptions: {
title: 'Perfil no Github'
}
}
}, {
defaultNavigationOptions: { //opções de navegação aplicadas a todas as telas
headerTintColor: '#FFF',
headerStyle: {
backgroundColor: '#7d40e7'
}
}
})
);
export default Routes; //exportar as rotas
Thanks, it worked out, I’m starting with React, React Native and Node yet
– José Guilherme