map function error
Unanswered
Horned Grebe posted this in #help-forum
Horned GrebeOP
I got an error as map is not defined
Am using next js mongodb
Am using next js mongodb
18 Replies
it seems like your products are not mapable. What's the value of the variable? You can see it, when you do console.log(products); @Horned Grebe
Horned GrebeOP
In console values are displaying not on browser it is showing map function error
@Horned Grebe In console values are displaying not on browser it is showing map function error
could you show a screenshot?
or try
or try
products?.map()Horned GrebeOP
If I comment map function displaying values on console
@Horned Grebe If I comment map function displaying values on console
products.result.map()Horned GrebeOP
@Horned Grebe Click to see attachment
oh then it should be
products.map()or change the
getProducts function to thisconst getProducts = async () => {
const res = await fetch("http://localhost:3000/api/products")
const data = await res.json()
return data.success ? data.result : []
}btw, you shouldn't fetch own api route and just fetch the data directly from database in the server component
Horned GrebeOP
Problem with my code is it was fetching data from database but not displaying on the bowser with map function as it was displaying code on the console all values
Horned GrebeOP
But am not using dynamic route
Horned GrebeOP
In the official link the app router[useid] like this
@Horned Grebe In the official link the app router[useid] like this
oh it doesn't matter, the point is you should fetch the data directly from database instead of route handler
Horned GrebeOP
K I will try