Question

我有一个简单的连接表单，我希望在连接后将我的用户重定向到我的主页。我的表单中的action似乎无效，因为发送表单后URL不变。

这是我的Login class文件中Login.tsx的内容

constructor(props) {
    super(props);
    this.state = {
      email: "",
      password: ""
    }
  }

  handleSubmit() {
    const email = this.state.email;
    console.log(email);
    const password = this.state.password;
    console.log(password);
    axios.post("http://snapi.epitech.eu/connection", { email, password } 
        ).then(reponse => {
            console.log('connect', reponse);
        }).catch(error => {
            console.log('error', error);
    });

}

  render() {
    //const { dataSource, fromFetch, fromAxios, loading, axiosData } = this.state
    return (
    <View style={styles.container}>
      <Text>Connection</Text>
      <form onSubmit={ this.handleSubmit }
            action="localhost:19006/home">
        <label>email</label>
        <TextInput 
          //name="email"
          style={styles.input}
          value={ this.state.email } 
          onChangeText={ email => this.setState({email}) } 
          //onChange={val => this.onChange('email', val)}
        />
        <label>password</label>
        <TextInput 
          style={styles.input}
          secureTextEntry={true}
          value={ this.state.password } 
          onChangeText={ password => this.setState({password}) } 
          //onChange={val => this.onChange('password', val)}
        />
        <Button title="Inscription" 
          type="submit"
          onPress={this.handleSubmit.bind(this)}
        />
      </form> 
    </View>
  );
  }
};

Answer 1

您需要使用react native导航，如下所示：

import { NavigationActions } from 'react-navigation';
const routeName = "Home" // string e.g 'Home'
const params = {         // object (key value pair)
     key1: value1,
     key2: value2
}
NavigationActions.navigate({ routeName, params }),

or

this.props.navigation.navigate(routeName, params)

在表单提交React Native

1 个答案: