cari

Rumah  >  Soal Jawab  >  teks badan

Penapis ungkapan biasa untuk kotak carian dan kotak semak tindanan MERN

Saya cuba mempelajari cara tindanan MERN berfungsi bersama dengan belajar dengan melakukan dan saya mengikuti tutorial ini untuk bezcoder: Node.js/Express/MongoDb (Kod keseluruhan Github) dan Reactjs (kod keseluruhan Github)

Contoh data daripada pelayan

[
  {
    "id": "5f9bdace778082303c859248",
    "title": "How to cook noodles",
    "description": "This is a tutorial about how to cook noodles in under 10 minutes.",
    "published": false
  },
  {
    "id": "5f9bdae3778082303c859249",
    "title": "How to bake a chocolate cake",
    "description": "This is a tutorial about how to bake chocolate cake using cocoa powder.",
    "published": true
  }
]

Keadaan semasa Pada masa ini, bahagian hadapan apl mempunyai bar carian tempat saya boleh mencari dan menapis data mengikut "tajuk" tutorial (cth. "Mi" untuk mendapatkan yang pertama). Saya dapati ini dilakukan dengan coretan kod berikut:

  1. tutorial.controller.js
exports.findAll = (req, res) => {
  const title = req.query.title;
  var condition = title ? { title: { $regex: new RegExp(title), $options: "i" } } : {};

  Tutorial.find(condition)
    .then(data => {
      res.send(data);
    })
    .catch(err => {
      res.status(500).send({
        message:
          err.message || "Some error occurred while retrieving tutorials."
      });
    });
};
  1. services/tutorial.service.js (dalam Reactjs)
import http from "../http-common";

class TutorialDataService {

...
  
  findByTitle(title) {
    return http.get(`/tutorials?title=${title}`);
  }
}

export default new TutorialDataService();

Apa yang saya ingin tahu ialah , bagaimana untuk menukar kod ini supaya saya boleh menapis mengikut perkataan dalam kotak carian "tajuk" dan "huraian" dan juga kotak pilihan published:true pass.

Jika bahagian hadapan kelihatan seperti ini:

Percubaan saya

  1. tutorial.controller.js
exports.findAll = (req, res) => {
  const title = req.query.title || "";
  const description = req.query.description || "";
  const published = req.query.published;

  Tutorial.find(
    {
    $or: [
        {title: { $regex: new RegExp(title), $options: "i"}}, {description: { $regex: new RegExp(description), $options: "i"}}
    ],
    $and: [
        .... and here if checked, then only show published, else show all ....
    ]

}

  )
    .then(data => {
      res.send(data);
    })
    .catch(err => {
      res.status(500).send({
        message:
          err.message || "Some error occurred while retrieving tutorials."
      });
    });
};
  1. services/tutorial.service.js (dalam Reactjs)
import http from "../http-common";

class TutorialDataService {

...
  
  findByTitle(title, description, published) {
    return http.get(`/tutorials?title=${title}`, `/tutorials?description=${description}`, `/tutorials?published=${published}`);
  }
}

export default new TutorialDataService();

Saya tidak pasti sama ada ini adalah penggunaan findByTitle yang betul dan cara melaksanakan fungsi ATAU dan DAN dengan betul.

P粉302160436P粉302160436263 hari yang lalu614

membalas semua(1)saya akan balas

  • P粉792673958

    P粉7926739582024-04-07 00:09:45

    Milik anda { 中的代码在教程查找查询中出错。 $or 每个查询都需要单独的 { }. Gunakannya seperti di bawah. Ia akan berfungsi. Digunakan untuk mencari dalam tajuk, perihalan dan kotak pilihan yang diterbitkan.

    Tutorial.find:({
    $or: [
            {title: { $regex: new RegExp(title), $options: "i"},
            {description: { $regex: new RegExp(description), $options: "i"}
        ],
    published:true
    })

    balas
    0
  • Batalbalas