如何将后端查询的结果返回到前端以显示在页面上

汉森

简单查询

var MongoClient = require('mongodb').MongoClient;

var input = "ito";
var regexInput = new RegExp(input);

//I have removed the url and db name for privacy purposes
MongoClient.connect('', function(err, db) {
  if (err) throw err;
  var dbo = db.db("");
  var query = { brand_name: regexInput };
  dbo.collection("snacks").find(query).toArray(function(err, result) {
    if (err) throw err;
    console.log(result);
    db.close();
  });
});

我目前正在尝试了解MERN堆栈并开发应用程序。这是我的简单查询,我只是在搜索带有“ orit”子字符串的零食,然后返回带有“ Doritos”等的零食。如何集成此查询或获取结果并将其显示在前端的页面上。也许有一种可能的方法可以完全在前端上完成所有工作?

前端页面

import React, { Component } from 'react';
import styles from "./styles.module.css";

export default class SnackSearch extends Component {
    render() {

        return (
            <div>
                <h1 className = {styles.h1}>Search for your snack</h1>
                
            </div>
        )
    }

}

如有必要,这是我的简单前端。我还想问一问我如何也可以实现反向操作,在这里我得到用户输入并将其作为变量“输入”发送到我的后端,并再次返回结果。我希望我不要因为我的简单问题而要求直接的答案/解决方案。我不介意是否提供任何形式的提示/指导或资源/视频,以便我自己学习。我曾尝试研究axios和ajax的用法,但不确定如何应用这两种方法。

韦伯

由于服务器和客户端是两个不同的环境,因此您必须将从数据库获取的数据从服务器传输到客户端。

您可以使用明确端点执行此操作res.send(myData)端点可以负责调用数据库。

在客户端上,您将必须调用该端点以请求数据。然后,您可以使用此数据将其显示在您的反应页面中。React官方文档中有一个明确的示例来获取数据。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

执行php脚本后如何将mysql查询结果返回到html页面?

来自分类Dev

PHP数据库查询:如何将while循环的结果返回到Javascript变量?

来自分类Dev

Prestashop后端和前端模块在某些页面上显示错误

来自分类Dev

如何将JSON结果返回到Ajax.BeginForm

来自分类Dev

如何将JSON结果返回到Ajax.BeginForm

来自分类Dev

如何将结果列表从 sequelizejs 返回到 grpc?

来自分类Dev

如何使用猫鼬将查询结果返回到变量

来自分类Dev

如何使用猫鼬将查询结果返回到变量

来自分类Dev

如何将SQL返回数组更改为值并返回到前端?

来自分类Dev

在多个页面上显示查询结果

来自分类Dev

在ejs页面上显示MongoDB查询结果

来自分类Dev

在多个页面上显示查询结果

来自分类Dev

在TACTIC中,使用server.execute_cmd()方法时,如何将数据返回到前端?

来自分类Dev

使用Python,flask和SQLAlchemy如何将数据库查询的结果打印在HTML页面上?

来自分类Dev

当页面上的查找未返回任何结果时,如何将Google Chrome中的叮叮声静音?

来自分类Dev

如何使用include函数通过php变量将数据库查询的结果返回到另一个页面

来自分类Dev

如何将前端HTML / JQuery连接到后端Python

来自分类Dev

如何将数据从AngularJS前端传递到Nodejs后端?

来自分类Dev

BDD周期-如何将后端与前端连接

来自分类Dev

如何将参数前端匹配到后端 API

来自分类Dev

如何将参数从 Jupyter 后端传递到前端扩展

来自分类Dev

如何将值返回到数组

来自分类Dev

如何将来自Google Apps脚本的结果显示为HTML页面上的文本?

来自分类Dev

如何将SQL Server存储过程结果返回到Excel

来自分类Dev

如何将结果从模型返回到Node.js中的控制器

来自分类Dev

如何将函数的结果从外部JavaScript脚本返回到pug文件?

来自分类Dev

如何将Oracle存储过程的结果返回到Shell脚本

来自分类Dev

如何将存储过程的结果返回到用于插入记录的select语句

来自分类Dev

如何将“then”回调函数的结果返回到环回 4 控制器

Related 相关文章

  1. 1

    执行php脚本后如何将mysql查询结果返回到html页面?

  2. 2

    PHP数据库查询:如何将while循环的结果返回到Javascript变量?

  3. 3

    Prestashop后端和前端模块在某些页面上显示错误

  4. 4

    如何将JSON结果返回到Ajax.BeginForm

  5. 5

    如何将JSON结果返回到Ajax.BeginForm

  6. 6

    如何将结果列表从 sequelizejs 返回到 grpc?

  7. 7

    如何使用猫鼬将查询结果返回到变量

  8. 8

    如何使用猫鼬将查询结果返回到变量

  9. 9

    如何将SQL返回数组更改为值并返回到前端?

  10. 10

    在多个页面上显示查询结果

  11. 11

    在ejs页面上显示MongoDB查询结果

  12. 12

    在多个页面上显示查询结果

  13. 13

    在TACTIC中,使用server.execute_cmd()方法时,如何将数据返回到前端?

  14. 14

    使用Python,flask和SQLAlchemy如何将数据库查询的结果打印在HTML页面上?

  15. 15

    当页面上的查找未返回任何结果时,如何将Google Chrome中的叮叮声静音?

  16. 16

    如何使用include函数通过php变量将数据库查询的结果返回到另一个页面

  17. 17

    如何将前端HTML / JQuery连接到后端Python

  18. 18

    如何将数据从AngularJS前端传递到Nodejs后端?

  19. 19

    BDD周期-如何将后端与前端连接

  20. 20

    如何将参数前端匹配到后端 API

  21. 21

    如何将参数从 Jupyter 后端传递到前端扩展

  22. 22

    如何将值返回到数组

  23. 23

    如何将来自Google Apps脚本的结果显示为HTML页面上的文本?

  24. 24

    如何将SQL Server存储过程结果返回到Excel

  25. 25

    如何将结果从模型返回到Node.js中的控制器

  26. 26

    如何将函数的结果从外部JavaScript脚本返回到pug文件?

  27. 27

    如何将Oracle存储过程的结果返回到Shell脚本

  28. 28

    如何将存储过程的结果返回到用于插入记录的select语句

  29. 29

    如何将“then”回调函数的结果返回到环回 4 控制器

热门标签

归档