Search code examples
javascriptreactjsformsserveraxios

I have a problem with the data format by sending data to backend with Axios.post


Please help... If I send data to the backend as a data set (as in the example below), the server accepts the data without any problems.

axios.post('http://localhost:8080/repair',
        {
            description: 'Descriptiony',
            registrationNo: '8899',
            expire: '2020-12-13',
            startDate: '2020-11-29',
            status: 'Red',
            errorCode: 'e333',
            repairDescription: 'Reparatur',
            spitzName: 'Gumowa Kaczka'
        })
        .then((response) => {
            console.log(response);
        }, (error) => {
            console.log(error);
        });
    }

But if I send data as an object "this.props" then unfortunately I get an error 500 from the server. Here's code with this.props

continue = e => {
        e.preventDefault();
        console.log(this.props);

        axios.post('http://localhost:8080/repair', this.props,
        )
            .then((response) => {
                console.log(response);
                console.log(this.props);
            }, (error) => {
                console.log(error.message);
            });
        this.props.nextStep();
    };

I tried to view the data using console.log, but it seems to be correct. Many thanks for any help.


Solution

  • You should add your props name:

    axios.post('http://localhost:8080/repair', this.props.propsName)
    

    because props object has several default attributes like children and etc. that can causes the error in backend.