javascript - Axios POST 到服务器返回空字符串

Question

我有一个ReactJS表单，您可以在其中输入新的用户名，该用户名通过axios POST发送到服务器，最后保存到数据库。但是，当我单击“添加”(从而提交表单)时，它不会保存我在表单输入中输入的用户名，而是返回一个空字符串。

这是包含提交功能的表单代码:

addUser (e) {

    var data = {
        entry: this.state.currentname
    };

    axios.post('users/newuser', 
        data, {
        headers: {"Content-Type": "application/x-www-form-urlencoded"} 
        })
        .then(function (response) {
            console.log(response);
        })
        .catch(function (error) {
            console.log(error);
        });
}

render() {
    return (
        <div className="App">
            <form onSubmit={this.addUser} encType="multipart/form-data">
                <label>New username:</label>
                <input name="username" value={this.state.currentname} onChange={this.handleChange}></input>
                <button type="submit" >Add</button>
            </form>

            <h1>Current Users: </h1>
            <ul>
                {this.state.users.map((name, n) =>
                    <li key={"user_"+n}>{name.username}</li>
                )}
            </ul>
        </div>
    );
}

users 是包含我的 curd 函数的文件。以下是我当前向数据库添加数据的方式:

router.route('/newuser')
.post(function (req,res) {
    var newUser = new Todo();
    newUser.username = req.body.entry;
    newUser.save(function (err) {
        if(err) 
            res.send(err);
        res.send('User added successfully!');
    });
})

不幸的是，我不太确定出了什么问题，但我假设我没有在 users.js 中正确请求用户名，因为它确实将新数据插入到我的数据库中，但没有用户名。

这是我的文件夹结构(不知道是否相关):

-client
  public
    -index.html
  src
    -App.js(contains the form)
-server.js
-routes
  -users.js

我到底做错了什么以及如何解决这个问题？

Answer 1

所以我不确定这是否是解决问题的最佳方法，或者是否有更好的方法(我不会将自己的答案标记为正确答案，因为我不知道它有多正确)。

我所做的如下:我向 axios.post 请求中的字符串添加了一个查询参数，并在插入新数据的函数中调用 Node.js 中的该参数值。

这些是我更改的部分:

应用程序.js:

axios.post('users/newuser?username='+data.entry, 
    data, {
    headers: {"Content-Type": "application/x-www-form-urlencoded"} 
    })
    .then(function (response) {
        console.log(response);
    })
    .catch(function (error) {
        console.log(error);
    });

用户.js:

router.route('/newuser')
    .post(function (req,res) {
    var newUser = new Todo();
    newUser.username = req.body.username;
    newUser.save(function (err) {
        if(err) 
            res.send(err);
            res.send('User added successfully!');
        });
    })