У меня проблемы с созданием формы входа в систему с помощью Axios с реактивной системой на основе неуклюжего API - PullRequest
0 голосов
/ 04 февраля 2019

У меня проблемы с рэйн-нативом, использующим axios.Во-первых, я не знаю, как обрабатывать параметры API, так как я новичок в реакции-нативных и Axios.Во-вторых, я не знаю, как перенаправить на дом, если вход успешно.Я проверил его на POSTMAN, и он работает нормально.enter image description here

import React, { Component } from 'react';
import { 
    Text, 
    TouchableOpacity,
    View,
    TextInput,
    StyleSheet,
 } 
 from 'react-native';
 import axios from 'axios';


 export default class Login extends Component {
     constructor(props){
         super(props)
       this.state =  {
                username:'',
                password:''
         };
     }

     render(){
         return(
            <View style ={styles.container}>
                <View style={styles.logCon}>
                    <Text style={styles.loginText}>Login</Text>
                </View>
                <Text style= {styles.label}>Username</Text>
                <TextInput 
                  style={styles.textbox}  
                  autoCapitalize="none"
                  placeholder="Username"
                  onChangeText= {(text)=>{
                       this.setState({username: text});
                  }
                  }
                />
                <Text style= {styles.label}>Password</Text> 
                <TextInput 
                  style={styles.textbox}  
                  placeholder="Password"
                  secureTextEntry={true}
                  onChangeText= {(text)=>{
                       this.setState({password: text});
                  }
                  }
                />

                <View>
                    <Text>Forgot password</Text>
                </View>
                <TouchableOpacity style={styles.signin}
                onPress={() =>{
                    axios.request({
                        url: "/api/2019/token",
                        method: "post",
                        baseURL: "http://192.168.0.1:3000/",
                        auth: {
                            username: this.state.username,
                            password: this.state.password
                        },
                        data: {
                            "grant_type": "password&username=mary2@ApgDemo.ca&password=demodemo&client_id=RxPadApp",
                            "scope": "public"    
                        }
                        }).then(response => {
                        console.log(response.data);
                    }).catch(error =>{
                        console.log(error);
                    });
                }}


                >
                    <Text style={styles.signinText}>Sign In</Text>
                </TouchableOpacity>
                <View style={styles.signupTextCont}>
                    <Text style={styles.signupText}>Not an APG Member? </Text>
                    <Text 
                    style={{fontWeight:'bold', color: '#1A78B9'}}
                    onPress={() => this.props.navigation.navigate('SignupScreen')}
                    >
                    Sign Up
                    </Text>
                </View> 
            </View>
         );
     }
 }

Мне нужна ситуация, когда я могу войти в систему, используя имя пользователя и пароль, и перенаправить на домашнюю страницу

...