收到值问题，对象为空对象Axios / Post / bdd ReactJS

Question

我想解释一下我今天的问题。

在下面的代码中，我尝试发布给定的2个，我的服务器正确接收了它，不幸的是，我收到了2个空对象

我将尝试发布您可能需要的任何信息，我试图编写清晰的代码

如何解决此问题？

import React, { Component } from 'react';
import axios from 'axios';

export default class SignUpP2 extends Component {

constructor(props) {
    super(props)

    this.onChangeprenomNom = this.onChangeprenomNom.bind(this);
    this.onChangeexpiration = this.onChangeexpiration.bind(this);
    this.onSubmit = this.onSubmit.bind(this);

    this.state = {
      prenomNom: '',
      expiration: '',
    }
}

onChangeprenomNom(e) {
    this.setState({ prenomNom: e.target.value })
}
onChangeexpiration(e) {
  this.setState({ expiration: e.target.value })
 }
  onSubmit(e) {
    e.preventDefault()
    const prenomNom = {
      prenomNom  : this.state.prenomNom,
    };
    const expiration = {
      expiration  : this.state.expiration,
    };

    axios.post('https://fakeinfo.fr/api/user',{ expiration , prenomNom})
        .then((res) => {
            console.log(res.data)
        }).catch((error) => {
            console.log(error)
        });

    this.setState({ prenomNom: '', expiration:'', })
}
 render() {
     return (
        <div >
            <form onSubmit={this.onSubmit}>
              <div>

                <div>
                    <input
                     type="text" 
                     value={this.state.prenomNom} 
                     onChange={this.onChangeprenomNom} 
                     /> 
                </div>
                <div>
                    <input
                     type="text" 
                     value={this.state.expiration} 
                     onChange={this.onChangeexpiration} 
                     />       
                </div>
              </div>
                <div>
                 <button className="button-create-account"  type="submit" value="Create                                                        User" >
     GOO
     </button>
                </div>
            </form>
        </div>
    )
  }
}

这是我的路线，

app.post('/api/user', (req, res, ) => {
const formData = req.body;
console.log(req.body)

connection.query('INSERT INTO user SET ?', formData, (err, results) => {

if (err) {
  console.log(err);
  res.status(500).send("Erreur lors de la sauvegarde d'un employé");
} else {
  res.sendStatus(200);
}
 });
});

以及这里的结果myBDD

{
    "id": 38,
    "prenomNom": "[object Object]",
    "expiration": "[object Object]",
}

Answer 1

您的有效负载不正确，这是您应该这样做的方式：

const payload = { 
  prenomNom  : this.state.prenomNom,
  expiration  : this.state.expiration
}

axios.post('https://fakeinfo.fr/api/user', payload)