Node.js 如何在MERN应用程序中创建搜索表单

由于某种原因，我的搜索表单不起作用。如果我在搜索中键入某个内容，它会再次返回所有产品。我需要一些帮助

这是我的表格：

<form className="product--SearchForm" onSubmit={searchProduct}>
                            <input type="text" className="product--Search" name="search" placeholder="Search..."/>
                            <input type="submit" value="search"/>
                        </form>

以下是后端中的控制器：

router.get('/', (req, res) => {
    productService.getAll(req.query).then(products =>{
        res.status(200).json(products)
    }).catch(() => res.status(500).end())
})

以及服务：

async function getAll(query) {
    let products = await Product.find({}).lean()

    if (query.search) {
        products = products.filter(x => x.name.toLowerCase().includes(query.search))
    }

    return products;
}

---

可能是因为您没有向url添加查询。。。试试

${API}/products？search=您的搜索值

。谢谢！我还有一个问题。为什么要重新加载页面？我不希望这样，因为我有一个useEffect请求，它正在运行同一个请求，但适用于所有产品。我发现这个查询有.search，因为使用了重新加载，所以我看不到结果。这是提交表单时的默认行为，您应该在searchProduct方法中防止。。。const searchProduct=（e）=>{e.preventDefault（）；…}非常感谢您！

async function getAll(query) {
    let products = await Product.find({}).lean()

    if (query.search) {
        products = products.filter(x => x.name.toLowerCase().includes(query.search))
    }

    return products;
}