MongoDB和NextJS搜索系统无法正常工作的问题。

一种可能的解决方法是在Next.js应用程序中设置正确的MongoDB连接字符串和数据库名称，并使用Mongoose库创建MongoDB模型。然后，可以在前端使用axios或fetch等技术通过API调用后端来检索和过滤数据。以下是一个示例代码：

1. 在你的Next.js项目的根目录中安装mongodb和mongoose：

npm i mongodb mongoose

2. 在pages/api目录下创建一个名为search.js的新文件，并输入以下代码：

const mongoose = require("mongoose");

mongoose.connect("mongodb://localhost:27017/my_database", { useNewUrlParser: true, useUnifiedTopology: true, });

const searchSchema = new mongoose.Schema({ title: String, description: String, url: String, tags: Array, });

const Search = mongoose.model("Search", searchSchema);

export default async function handler(req, res) { const { query } = req.query;

try { const results = await Search.find({ title: { $regex: ${query}, $options: "i" }, }).limit(10);

res.status(200).json(results);

} catch (err) { console.error(err); res.status(500).send("Server Error"); } }

3. 在前端页面中使用axios或fetch来调用上面的API：

import axios from "axios"; import { useState } from "react";

export default function Search() { const [query, setQuery] = useState(""); const [results, setResults] = useState([]);

const handleSearch = async () => { try { const { data } = await axios.get(/api/search?query=${query});

  setResults(data);
} catch (err) {
  console.error(err);
}

};

return ( <div> <input value={query} onChange={(e) => setQuery(e.target.value)} /> <button onClick={handleSearch}>Search</button>

  <ul>
    {results.map((result) => (
      <li key={result._id}>{result.title}</li>
    ))}
  </ul>
</div>

); }

以上代码