Question

我有一个像这样的抽屉：

 MyDrawer= ({navigation }) => {
  const [show, setShow] = useState(true); 

  return (
    <Drawer.Navigator drawerContent={props => <CustomDrawerContent setShow={setShow} {...props} />}>
      <Drawer.Screen name="Feed" component={this.FeedScreen} />
      <Drawer.Screen name="Route" component={this.RouteScreen}
    </Drawer.Navigator>
  );
}

我的相关组件如下：

 FeedScreen= ({navigation}) => {
    return (
        <View style={styles.container} >
            <View   style={styles.containerTop} > 
            <Header
                leftComponent={{ icon: 'menu', color: '#fff' , onPress: () =>  navigation.openDrawer()} } 
                centerComponent={{ text: 'device', style: { color: '#fff' } }}
                rightComponent={{ icon: 'home', color: '#fff' }}
            />
            </View >
            <View   style={styles.container2} > 
                      <Text >submit form</Text>
                      <TextInput
                        style={{height: 40}}
                        placeholder="8604893512478963"
                        Name={'imei'}
                        defaultValue=''
                      />
                    <Button title="     login     " onPress={this.handleSubmit} /> 
            </View >
        </View>
    );
}

 RouteScreen = ({navigation}) =>{
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Route Screen</Text>
    </View>
  );
}

默认情况下，用户看到FeedScreen，提交后必须将其重定向到routescreen

如此

submit和api如下：

handleSubmit= ({navigation} ) => {
    var details = {
        'imei':  this.state.imei ,
        'password': 'Password!',
        'action': 'login'
    };
    var formBody = [];
    for (var property in details) {
        var encodedKey = encodeURIComponent(property);
        var encodedValue = encodeURIComponent(details[property]);
        formBody.push(encodedKey + "=" + encodedValue);
    }
    formBody = formBody.join("&");

fetch('http://example.com/api.php', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8',
    Accept: 'application/json', 
  },
  body: formBody
}).then((response) => response.json())
.then((json) =>{if(json.res=='-1'){ ToastAndroid.show('device not found', 1000) }else{navigation.navigate('Route')} } )
.then( this.setState({ visible: !this.state.visible }) )
.catch(error => console.error("error:", error));

}

api工作正常，如果id错误，则会显示device not found消息，但如果用户imei是正确的，则应用崩溃，并显示以下错误：

error：typeerror：undefined不是一个对象（求值 “ navigation.navigate”）

在api重新放置好之后，我已经将用户重定向到第二个屏幕，我该怎么做？？

Answer 1

您没有将导航传递到handleSubmit。

<Button title="     login     " onPress={()=>this.handleSubmit(navigation)} />

这将是如下所示的参数

handleSubmit= (navigation) => {

做出反作用的导航。导航不起作用

1 个答案: