mememoremore
mememoremore

Reputation: 292

Can I apply filter to data result of useStaticQuery in Gatsby.js

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

Answers (1)

Ferran Buireu
Ferran Buireu

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

Related Questions