I am trying to solve my problem with filtering data using GraphQL in Next.js. As a backend I use Strapi v4.
My code looks like this. This is the file [slug].js
which is in pages folder and this is page for dynamic route.
import React from 'react'
import { Stack } from '@mui/material'
import { gql } from '@apollo/client'
import { client } from '../_app'
const TEACHINGS_BY_SLUG = gql`
query TeachingsBySlug($slug: StringFilterInput){
teachings(filters: {slug: {eq: $slug}}){
data{
id
}
}
}
`
const PageTeaching = ({ teachings }) => {
console.log(teachings)
return (
<Stack alignItems='center'>
some filtered teachings
</Stack>
)
}
export const getStaticProps = async () => {
console.log('revalidation mate...')
const { data } = await client.query({
query: TEACHINGS_BY_SLUG,
variables: {
slug: "teaching1"
}
})
// const response = await fetch('http://localhost:1337/api/teachings?populate=*')
// const data = await response.json()
return {
props: {
teachings: data
},
revalidate: 10
}
}
export const getStaticPaths = async () => {
return {
paths: [{
params: { slug: "teaching1" }
}],
fallback: false
}
}
// export const getServerSideProps = async () => {
// const { data } = await client.query({
// query: TEACHINGS_BY_SLUG,
// variables: {
// slug: "teaching1"
// }
// })
// return {
// props: {
// teachings: data
// }
// }
// }
export default PageTeaching
I'm getting error 400 (as in the title above) and I know that the case should be in those two lines:
query TeachingsBySlug($slug: StringFilterInput){
teachings(filters: {slug: {eq: $slug}}){
Because without adding filters variables everything is OK. I guess it could be some wrong notation but I don't know.
I will probably use getServerSideProps
instead of getStaticProps
/ getStaticPaths
but I think it will not make any difference with filtering itself.
SOLVED
I solved my mistake. I mistakenly passed wrong schema name. Instead of passing "StringFilterInput" schema name, I should pass just "String" schema name.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.