首页 > 解决方案 > 如何使用状态在我的后端发出 POST 获取请求

问题描述

我现在正在开发我的第一个应用程序,该应用程序是在 react native 中为前端创建的,并使用 Node JS 作为后端,使用 mongodb 作为数据库。我正在尝试为我的用户实现注册表单,但我真的不知道如何对状态执行此操作,因为它一直说无法评估 this.state.name。我想要做的是使用 fetch api 注册一个使用 Postman 工作的帐户的 POST 请求,因此错误来自我的前端。

所以我要做的是创建我的函数来执行此操作,但我希望正文代表用户在不同字段中键入的值,我存储在状态中,当你看到代码时它会很清楚。如果我使用状态它不起作用但是如果我直接在我的函数中输入一些值它会起作用。

这第一件事是我的 fetch API 函数,如果我这样做它不起作用,下面是我如何获取每个字段的状态(请参阅 )

clickthebutton = () =>{
    //var data = this.state
    fetch('http://localhost:5050/api/new/register',{
        method:'POST',
        headers : {'Content-Type': 'application/json'},
        body : {
            name:this.state.name,
            age:this.state.age,
            password:this.state.password,
            email:this.state.email
        },       
    })
}
<Input
                        label="Your email address"
                        placeholder="yo@gmail.com"
                        onChangeText={(text)=> this.setState({email:text})}
                        value={this.state.email}
>

我的状态如下所示:

this.state={
            email:null,
            password:null,
            name:null,
            age:null,
            dataImage:null
        }

我想发送正文,如果我执行 body : this.state 当我在服务器上执行 console.log(req.body) 时它不会发送任何内容,它会显示一个空对象。

谢谢你的帮助

编辑:问题已解决,我的功能不是指我的班级。

标签: node.jsapireact-nativefetch

解决方案


获得您所在州的所有表单数据后,您有两个选项可以向后端发出请求。

设置Content-Typeapplication/text或删除header

fetch('http://localhost:5050/api/new/register',{
        method:'POST',
        headers : {'Content-Type': 'application/text'},
        body : {
            name:this.state.name,
            age:this.state.age,
            password:this.state.password,
            email:this.state.email
        },       
    })

推荐阅读