@nano_e_t_4

Как вернуть результат выполнения пост запроса?

Всем привет
Изучаю реакт, пишу небольшое приложение. Столкнулся с такой проблемой:
при авторизации отправляю пост запрос через axio на бэкенд. Бэкенд отвечат 200 и даже отдает профиль (потому сразу после вызова функции ставить вывод в консоль и профиль приходит) но на фронтенте это нигде не отображается\не сохраняется. То есть не совсем понимаю, как правильно вернуть резлуьтат апи функции в комоненет

Код отображения элемента:

function Login(props) {
    return (
        <div className="Login">
            <form onSubmit={props.args.handleSubmit}>
                <FormGroup controlId="email" bsSize="large">
                    <ControlLabel>Email</ControlLabel>
                    <FormControl
                        autoFocus
                        value={props.args.state.email}
                        onChange={props.args.handleChange}
                    />
                </FormGroup>
                <FormGroup controlId="password" bsSize="large">
                    <ControlLabel>Password</ControlLabel>
                    <FormControl
                        value={props.args.state.password}
                        onChange={props.args.handleChange}
                        type="password"
                    />
                </FormGroup>
                <Button
                    block
                    bsSize="large"
                    disabled={!props.args.validateForm()}
                    type="submit"
                >
                    Login
                </Button>
            </form>
        </div>
    );
}
export default Login


Код логики компонента:

export default class LoginContainer extends Component {
    constructor(props) {
        super(props);

        this.state = {
            email: "",
            password: ""
        };
    }
    validateForm() {
        return this.state.email.length > 0 && this.state.password.length > 0;
    }
    handleChange = event => {
        this.setState({
            [event.target.id]: event.target.value
        });
    }
    handleSubmit = event => {
        checkCredentials({"email":this.state.email, "password": this.state.password}, this)
        event.preventDefault();
    }
    render() {
        return (
            <Login args={this}/>
        );
    }
}

Код функции checkCredentials:
export function checkCredentials(credentials) {
    const options = {
        method: 'POST',
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
        data: qs.stringify(credentials),
        url: 'http://localhost/api/login',
        withCredentials: true
    };
    axios(options)
        .then(res => {
            store.dispatch(getProfileSuccess(res.data));
            return res
        })
}


В редаксе данных по профилю тоже нет (

Подскажите пожалуйста куда посмотреть
  • Вопрос задан
  • 73 просмотра
Пригласить эксперта
Ответы на вопрос 1
rockon404
@rockon404
Frontend Developer
redux-thunk
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Indacoin Москва
от 80 000 до 160 000 руб.
Acme Crypto Corp Нижний Новгород
от 120 000 до 200 000 руб.