Reputation: 292
I am a beginner in Gatsby.js, I am developing a page with a dropdown of 12 months. Once user select the month, I will pass the value into a component, which will display different set of result based on month selected.
There is a graphql query to retrieve data by using useStaticQuery in my component.
I understand the useStaticQuery cannot accept any variable, so is it possible to filter the returned data and create another data set based on the month inputted? Or should I just create 12 components and display the correspondning one based on month selected?
(Actually I tried to loop the data and return a single aggregate value successfully, but I not sure if it is possible to return a subset of data result
data.allData.edges.forEach(edge => {
if(edge.node.month==inputMonth)
total=total+edge.node.amount
})
outValue= total
)
Upvotes: 1
Views: 294
Reputation: 29320
I think you are trying to use a find()
loop. In your case:
let matchedMonth = data.allData.edges.find(edge => edge.node.month === inputMonth)
Basically, you are looping through allData
(all months) to find which one is exactly equal to inputMonth
. Since you are saving it in matchedMonth
you can play whatever you want (passing to a component, etc).
Upvotes: 2