Как сделать POST-запрос с помощью axios в react?

У меня проблемы с запросом почты axios. Когда я нажимаю на Button, ничего не происходит. Предполагается, что данные, которые я ввожу в поля ввода, отправляются в API. Однако, когда я нажимаю на кнопку, не происходит никакого перенаправления или чего-либо еще. Я не уверен, что функция onClick в кнопке никогда не срабатывает, или проблема заключается в вызове axios, а затем функции useNavigate. Я попробовал несколько различных способов использования этих функций, но ни один из них не сработал. Возможно, это синтаксическая проблема, так как я новичок в react. Буду признателен за любую помощь!

Полный код:

Попробуйте это: 

<Button onClick={AddContactInfo}>
  Add Contact
</Button>

    

import axios from 'axios';                
    const url = 'http://localhost:8000/api/';
            
            axios.post(url , formField)
                .then(response => {

                     console.log(response.data);
             history('/', { replace: true });

                })
                .catch(({response}) => {
                    console.log(response);
                });

Попробуйте вызвать функцию таким образом :)

<Button onClick={AddContactInfo}>
  Add Contact
</Button>

Сначала переименуйте AddContactInfo в addContactInfo, а затем:

<Button onClick={addContactInfo}>
   Add Contact
</Button>

Вы должны исправить метод addContactInfo следующим образом:

const AddContactInfo = () => {
        let formField = new FormData();
        formField.append('first_name', first_name)
        formField.append('last_name', last_name)
        formField.append('mobile_number', mobile_number)
        formField.append('home_number', home_number)
        formField.append('work_number', work_number)
        formField.append('email_address', email_address)

         axios.post('http://localhost:8000/api/', {
            data: formField
        }).then(function (response) {
            console.log(response.data);
            history('/', { replace: true });
        })
    }
Вернуться на верх