时间戳

首页 > 解决方案 > 有什么方法可以发送 post 请求以在 MongoDB 中检查和插入值以做出反应？

javascript - 有什么方法可以发送 post 请求以在 MongoDB 中检查和插入值以做出反应？

问题描述

我正在尝试搜索学生记录是否在云数据库中。为此，我想在表单中提交学生 ID 并发布到预构建的云 MongoDB，如果找不到学生 ID，那么我会将这个未找到的 ID 添加到数据库中。至此，我完成了将学生 ID 作为 post 请求提交给 MongoDB 的组件。我不知道如何为云数据库添加新价值。我怎么能在 reactjs 中做到这一点？任何想法？我怎样才能做到这一点？

我做了什么：

这是简单的检查学生 ID 组件，我可以在其中将学生 ID 作为发布请求提交给给定的 REST API，然后在 DB 中搜索值并相应地更新 DB。

import React, {Component} from 'react'

export default class CehckInStdID extends Component {
    constructor() {
      super();
      this.state = {       
        stdID: '',
        checkInStatus:'False',
        Rsvp_status: 'False'
      };
      this.onSubmit = this.handleSubmit.bind(this);
    }
    handleSubmit(e) {
      e.preventDefault();
      var self = this;
      // On submit of the form, send a POST request with the data to the server.
      fetch('/getStudentList', { 
          method: 'POST',
          data: {
            stdID: self.refs.stdID
          }
        })
        .then(function(response) {
          return response.json()
        }).then(function(body) {
          console.log(body);
        });
    }
    // handle change when values is changed
    handlechange = ({target: {value}}) => this.setState(state => value.length <= 9 && !isNaN(Number(value)) && {value} || state)
    render() {
      return (
        <form onSubmit={this.onSubmit}>
          {/* <input type="text" placeholder="enter student ID" ref="stdID" value={this.state.value} onChange={this.handlechange}/> */}
          <input placeholder="enter student ID" value={this.state.value} onChange={this.handlechange}/>
          <input type="submit" />
        </form>
      );
    }
  }

更新：数据库中有什么：

这是数据库中的模板学生记录：

[{"uin":"12323444","studentInfo":{"firstName":"alex","middleName":"","lastName":"stark","rsvpStatus":"false","checkin":"true"}},
{"uin":"670168300","studentInfo":{"firstName":"Jonathan","middleName":"Samson","lastName":"Rowe","rsvpStatus":"true","checkin":"true"}},
{"uin":"54556666","studentInfo":{"firstName":"adren","middleName":"hade","lastName":"nickson","rsvpStatus":"false","checkin":"false"}},
{"uin":"45456666","studentInfo":{"firstName":"jack","middleName":"","lastName":"woods","rsvpStatus":"Yes"}}]

目标：

我将在 DB 中检查输入的学生 ID，在这里我可以调用 REST API 与 MongoDB 进行通信；如果在 DB 中没有找到学生 ID，那么我将添加三个字段：studentID=xxxxxxxxx, checkInStatus=True, Rsvp_status=False;

我不确定如何做出反应。有什么想法可以完成吗？谢谢

标签： javascriptreactjsmongodb

解决方案

试试这个 // 在提交表单时，不是向服务器发送带有数据的 POST 请求，而是首先从服务器获取学生列表的所有数据，然后将集合中每个学生的 id 与学生 id 进行比较收到的表格。像这样

handleSubmit(e) {
      e.preventDefault();
      var self = this;
      fetch('/getAllStudentsList').then(function(response) {
      let responseData = response.json();
      for (let eachData in responseData){
          if(responseData[eachData].uin == self.refs.stdID){
              console.log("Data is already present");
              return;
          }
          else{
              this.setState({
                 studentID:xxxxxxxxx, 
                 checkInStatus:True, 
                 Rsvp_status:False
              }, ()=>{
                     fetch("/addNewStudent",{
                         method:'POST',                             
                         body: {this.state.studentID,
                                           this.state.checkInStatus,
                                           this.state.studentID} 
                     }).then(function(response) {
                           return response.json()
                     }).then(function(body) {
                           console.log(body);
                     })
              })
          }
      }
  })
}

我希望它会对您有所帮助，并为您提供该方法背后的主要思想。

推荐阅读