为什么getStaticPaths不使用groq和sanity

Question

我在努力让这件事成功，但它不会.-该死的.

我正试图使用下一个js和理智的io在一起，我没有运气。

如果有人能给我指明正确的方向，我会很高兴的。

我尝试了许多不同的方法来避免我所犯的错误。

import {groq} from 'next-sanity'
import {getClient} from '../lib/sanity.server'




export const getStaticPaths = async () => {

  const query =  groq`
  *[_type == "page"]{
    _id,
    title,
    slug
    
  }
  
  
  
  `;

  const pages = await getClient().fetch(query)

  const paths = pages.map(page => {

    return{
      params: { slug: page.slug.current}
    }
  })

  return{
    paths,
    fallback: false
  }



}

export const getStaticProps = async (context) => {

  const slug = context.params.slug
const queryTwo =  groq`
  *[_type == "page" && slug.current == ${slug}}]{
    _id,
    title,
    slug
    
  }
  
  `;

  const data = await getClient().fetch(queryTwo)




  return{
    props: {page: data }
  }



}

export default function pageTemplate({page}) {


return(
    <h1>{page.title}</h1>
   


)


}

从我的代码中可以看出，我不是专家，但我以前从未遇到过这样的问题。

我所犯的错误是

ClientError:预期的‘]以下表达式

此错误发生在生成页面时。任何控制台日志都将显示在终端窗口中。

解决这个问题的方法如下，我终于明白了。

import {groq} from 'next-sanity'
import {getClient} from '../lib/sanity.server'




export const getStaticPaths = async () => {

  const query =  groq`*[_type == "page"]`;

  const pages = await getClient().fetch(query)

  // const paths = pages.map(page => {

  //   return{
  //     params: { slug: page.slug.current}
  //   }
  // })

  const paths = Object.keys(pages).map((key) => {
    const page = pages[key]

    return{
      params: {slug: page.slug.current}
    }
  })

  return{
    paths,
    fallback: false
  }



}

export const getStaticProps = async (context) => {

  const {slug = ''} = context.params
const queryTwo =  groq`
  *[_type == "page" && slug.current == ${slug}}{
    _id,
    title,
    slug
    
  }
  
  `;

  const data = await getClient().fetch(`
  *[_type == "page" && slug.current == $slug][0]
`, { slug })




  return{
    props: {page: data }
  }



}

export default function pageTemplate({page}) {


return(
    <h1>{page.title}</h1>
   


)


}

Answer 1

嗨，盖伊，我只想给你发我的答案！

几个小时后，我的头撞在墙上，我终于明白了。

代码如下，复制和粘贴将工作:)

import {groq} from 'next-sanity'
import {getClient} from '../lib/sanity.server'




export const getStaticPaths = async () => {

  const query =  groq`*[_type == "page"]`;

  const pages = await getClient().fetch(query)

  // const paths = pages.map(page => {

  //   return{
  //     params: { slug: page.slug.current}
  //   }
  // })

  const paths = Object.keys(pages).map((key) => {
    const page = pages[key]

    return{
      params: {slug: page.slug.current}
    }
  })

  return{
    paths,
    fallback: false
  }



}

export const getStaticProps = async (context) => {

  const {slug = ''} = context.params
const queryTwo =  groq`
  *[_type == "page" && slug.current == ${slug}}{
    _id,
    title,
    slug
    
  }
  
  `;

  const data = await getClient().fetch(`
  *[_type == "page" && slug.current == $slug][0]
`, { slug })




  return{
    props: {page: data }
  }



}

export default function pageTemplate({page}) {


return(
    <h1>{page.title}</h1>
   


)


}