React + MongoDB GET Request with Params How to

Question

I'm trying to access a document from my MongoDB Database that contains the name value equal to what I'm passing from my FrontEnd. Right now, I'm getting a 200 Response, but the data is null, and the logs say my query is undefined, but I have no idea why.

Here's how my BE looks like:

recordRoutes.route("/test").get(function (req, res) {
  let db_connect = dbo.getDb();
  let query = req.params.currentName;
  console.log('QUERY:', query);

   
  db_connect.collection("records").findOne({'name': query}, function (err, result) {
    if (err) throw err;
    res.json(result);
    
  });
});

And this is my call in Frontend:

 const fetchUser = useCallback(async (e) => {
        e.preventDefault();

       await axios.get(`http://localhost:5000/test`, {params: {currentName}} )
        .then((response) => {
            console.log('RESPONSE IS:', response);
           // console.log('RESPONSE.DATA:', response.data);
            //return response;
            
        })
        .then((data) => {
            console.log('DATA IS:', data);
            setData(data);
        })
        .catch((e) => console.log(e))
        


       //return;
      }

    , [currentName]);

Any idea why I'm not getting anything?

NOTE: If I'm hardcoding in my Backend .findOne({'name': 'Test2'}, .. etc, it does find the document where the name is indeed Test2. I'm guessing there's a problem with how I'm getting the req.params.currentName, somehow.

Any help would be HUGELY appreciated. Thank you!

Answer 1

In front-end change the request URL to this

await axios.get(`http://localhost:5000/test/${currentName}`)

In the API route modify the route like this

recordRoutes.route("/test/:currentName").get(function (req, res) {