你好一切都好吗?我正在开发一个商业应用程序。第一次访问/单击时,我遇到了与 Stack 和 Drawer 导航相关的问题。
此应用程序使用 API 登录 (ScreenLogin),仅使用 CPF(个人密码)进行身份验证。认证成功后,会跳转到首页(ScreenHome),这里会报错
第一次登录时,会出现这个错误,即第一次登录时,app crash。请记住,第二次以后打开应用程序不会出现错误,并且运行完全正常。
当我点击onPress={this.props.navigation.navigate("InvoicesScreen")}
错误带有负载 {"name":"InvoicesScreen","params":{"item":"Invoices"}} 的操作 'NAVIGATE' 没有被任何导航器处理。
你有一个名为“InvoicesScreen”的屏幕吗?
如果您尝试导航到嵌套导航器中的屏幕,请参阅https://reactnavigation.org/docs/nesting-navigators#navigating-to-a-screen-in-a-nested-navigator。
这是一个仅限开发的警告,不会在生产中显示。
当我点击onPress={() => this.props.navigation.openDrawer()}
ERROR TypeError: undefined is not a function, js engine: hermes
if (appLoaded && fontsReady && imagesReady) {
return (
<NativeBaseProvider>
<RootSiblingParent>
<StatusBar backgroundColor={Colors.PRIMARY} barStyle='light-content'/>
<NavigationContainer>
{isLogged ? <Logged/> : <Guest/>}
</NavigationContainer>
</RootSiblingParent>
</NativeBaseProvider>
);
}
_getData = async () => {
this.setState({ buttonVisible: false });
const { senha } = this.state;
if (senha.length <= 0) {
Toast.show('O campo CPF/CNPJ não pode ser vazio', Toast.LONG, { backgroundColor: 'blue', fontSize: 28, fontFamily: 'Montserrat-Regular' });
this.setState({ buttonVisible: true });
return;
}
return await fetch(Configs.URL+`json/data_contratos.php?cpf=${senha}&senha=${senha}&ip=${Configs.IP}`)
.then((response) => response.json())
.then((responseJson) => {
this.setState({
dataContrato: responseJson.contratos,
contrato: responseJson.contratos[0].contrato,
keystatus: responseJson.contratos[0].status.trim(),
contContrato: responseJson.contratos.length
});
const { contContrato, contrato, keystatus } = this.state;
if (contContrato > 1) {
this._openModalContratos();
this.setState({ buttonVisible: true });
return null;
} else {
AsyncStorage.setItem('keycontrato'+Configs.SLUG, contrato.toString());
AsyncStorage.setItem('keycpfcnpj'+Configs.SLUG, senha);
AsyncStorage.setItem('keysenha'+Configs.SLUG, senha);
AsyncStorage.setItem('keystatus'+Configs.SLUG, keystatus);
this._goHome();
}
}).catch((e)=> {
Toast.show('O CPF/CNPJ não foi localizado.', Toast.LONG, { backgroundColor: 'blue', fontSize: 28, fontFamily: 'Montserrat-Regular' });
this.setState({ buttonVisible: true });
});
}
_goHome = () => {
const resetAction = CommonActions.reset({
index: 0,
routes: [
{ name: 'HomeScreen' }
],
});
this.props.navigation.dispatch(resetAction);
};
import { Ionicons } from '@expo/vector-icons';
import { createStackNavigator } from '@react-navigation/stack';
import React from 'react';
import HelpsScreen from '../screens/Helps';
import HomeScreen from '../screens/Home';
import LoginScreen from '../screens/Login';
import Colors from '../utils/Colors';
const Stack = createStackNavigator();
export default function StackNavigation(props){
const buttonLeft = () => {
return (
<Ionicons name={'md-arrow-back'} onPress={ () => { navigation.goBack() }} style={styles.arrowbackicon}/>
)
};
const navigatorOptions = {
headerStyle: {
backgroundColor: Colors.PRIMARY,
shadowColor: 'transparent',
elevation: 0,
shadowOpacity: 0,
},
headerTitleStyle: {
fontSize: 18,
color: Colors.BLACK
},
headerTitleAlign: 'center',
headerBackTitleVisible:false,
headerTintColor: Colors.BLACK
}
return (
<Stack.Navigator screenOptions={navigatorOptions}>
<Stack.Screen name="LoginScreen" component={LoginScreen} options={{ headerShown: false }}/>
<Stack.Screen name="HelpsScreen" component={HelpsScreen} options={{ headerShown: false }}/>
<Stack.Screen name="HomeScreen" component={HomeScreen} options={{ headerShown: false }}/>
</Stack.Navigator>
)
}
import { Ionicons } from '@expo/vector-icons';
import { createStackNavigator } from '@react-navigation/stack';
import React from 'react';
import { StyleSheet } from 'react-native';
import DetectorScreen from '../screens/Detector';
import HomeScreen from '../screens/Home';
import InternetScreen from '../screens/Internet';
import InvoicesScreen from '../screens/Invoices';
import LoginScreen from '../screens/Login';
import ReactivateScreen from '../screens/Reactivate';
import SpeedScreen from '../screens/Speed';
import SupportScreen from '../screens/Support';
import SupportSendScreen from '../screens/SupportSend';
import Colors from '../utils/Colors';
const Stack = createStackNavigator();
export default function Logged(props){
const {navigation} = props;
const navigationOptions = {
headerStyle: styles.headerStyle,
headerBackTitle: null,
headerTintColor: Colors.PRIMARY,
headerTitleAlign: 'center',
headerTitleStyle: {
textAlign: 'center',
alignSelf: 'center',
justifyContent: 'space-between',
fontSize: 16,
color: Colors.PRIMARY,
fontWeight: 'bold'
},
headerBackTitleVisible:false,
}
const buttonLeft = () => {
return (
<Ionicons name={'md-arrow-back'} onPress={ () => { navigation.goBack() }} style={styles.arrowbackicon}/>
)
};
return (
<Stack.Navigator screenOptions={navigationOptions}>
<Stack.Screen name="HomeScreen" component={HomeScreen} options={{ headerShown: false }}/>
<Stack.Screen name="InvoicesScreen" component={InvoicesScreen} options={{ headerShown: false }}/>
<Stack.Screen name="ReactivateScreen" component={ReactivateScreen} options={{ headerShown: false }}/>
<Stack.Screen name="SupportScreen" component={SupportScreen} options={{ headerShown: false }}/>
<Stack.Screen name="SupportSendScreen" component={SupportSendScreen} options={{ headerShown: false }}/>
<Stack.Screen name="SpeedScreen" component={SpeedScreen} options={{ headerShown: false }}/>
<Stack.Screen name="InternetScreen" component={InternetScreen} options={{ headerShown: false }}/>
<Stack.Screen name="DetectorScreen" component={DetectorScreen} options={{ headerShown: false }}/>
<Stack.Screen name="LoginScreen" component={LoginScreen} options={{ headerShown: false }}/>
</Stack.Navigator>
)
}
const styles = StyleSheet.create({
headerStyle:{
backgroundColor: Colors.PRIMARY,
shadowOpacity: 0,
borderBottomWidth: 0,
elevation: 0,
},
})
import { createDrawerNavigator } from "@react-navigation/drawer";
import React from "react";
import Logged from './Logged';
import SideMenu from './SideMenu';
const Drawer = createDrawerNavigator();
const Navigation = () => {
return (
<Drawer.Navigator initialRouteName="app" drawerContent={(props) => <SideMenu {...props} />}>
<Drawer.Screen name="main" component={Logged} options={{ headerShown: false }}/>
</Drawer.Navigator>
);
};
export default Navigation;
帮助我,我是初学者!
因为谢谢!
埃迪