Reactjs 为什么我的useState不为我的盖茨比网站工作? constindexpage=()=>{ 常量元数据=useStaticQuery(graphql` 质疑{ 所有的标记{ 边缘{ 节点{ 前沿物质{ 名称 } html } } } 场地{ 站点元数据{ 标题 位置 简介简介 } } } `) 常量[ReviewArray]=useState( metaData.allMarkdownRemark.edges ) 常量[currentReviewIndex,setCurrentReviewIndex]=useState(0) 常量[currentReview]=useState( ReviewArray[currentReviewIndex] ) const increaseCurrentReview=()=>{ setCurrentReviewIndex(1) } 返回( {metaData.site.sitemata.title} {metaData.site.sitemata.locations} {metaData.site.sitemata.title}

Reactjs 为什么我的useState不为我的盖茨比网站工作? constindexpage=()=>{ 常量元数据=useStaticQuery(graphql` 质疑{ 所有的标记{ 边缘{ 节点{ 前沿物质{ 名称 } html } } } 场地{ 站点元数据{ 标题 位置 简介简介 } } } `) 常量[ReviewArray]=useState( metaData.allMarkdownRemark.edges ) 常量[currentReviewIndex,setCurrentReviewIndex]=useState(0) 常量[currentReview]=useState( ReviewArray[currentReviewIndex] ) const increaseCurrentReview=()=>{ setCurrentReviewIndex(1) } 返回( {metaData.site.sitemata.title} {metaData.site.sitemata.locations} {metaData.site.sitemata.title},reactjs,gatsby,Reactjs,Gatsby,{metaData.site.sitemata.profileIntroduction} {''} 如果有区别的话,我在控制台中也有一个错误:React Hot Loader:React元数据不是异步结果吗?是的,但我的状态正确地接收元数据结果,当我尝试调用increaseCurrentReviewIndex并调用currentReviewIndex的状态更改器时,它不起作用。这是我正在寻找的主要问题当我试图调用increaseCurrentReviewIndex时,我在问题中不够清楚,这对

{metaData.site.sitemata.profileIntroduction}

{''}
如果有区别的话,我在控制台中也有一个错误:React Hot Loader:React元数据不是异步结果吗?是的,但我的状态正确地接收元数据结果,当我尝试调用increaseCurrentReviewIndex并调用currentReviewIndex的状态更改器时,它不起作用。这是我正在寻找的主要问题当我试图调用increaseCurrentReviewIndex时,
我在问题中不够清楚,这对我不利。您问题中的代码从未调用increaseCurrentReviewIndex。它没有调用它,或者是setCurrentReviewIndex不起作用,因为我试图添加一个console.log来增加CurrentReview,以及console.log正在进行,但不是应该更改状态的setCurrentReviewIndex。除了另一个
useState
hook的一个初始值之外,您问题中的任何代码在更新后都不会消耗
currentReviewIndex
,因此我不希望在将其设置为
1
后发生太多事情。您可以删除
useEffect(()=>console.log(currentReviewIndex),[currentReviewIndex])
在正文中测试状态是否正在更新。元数据不是一个异步结果吗?是的,但是我的状态正确地接收元数据结果,当我尝试调用increaseCurrentReviewIndex并调用currentReviewIndex的状态更改器时,它不起作用。这是我正在寻找解决方案的主要问题为了…当我试图调用IncremaseCurrentReviewIndex时,我的问题不够清楚,这对我不利。你问题中的代码从未调用IncremaseCurrentReviewIndex。它没有调用它,或者是setCurrentReviewIndex不起作用,因为我试图添加一个console.log来增加当前的审阅,而console.log正在运行粗略,但不是应该更改状态的setCurrentReviewIndex。除了另一个
useState
hook的一个初始值之外,您问题中的任何代码在更新后都不会消耗
currentReviewIndex
,因此我不希望在将其设置为
1
后发生太多事情。您可以删除
useEffect()=>console.log(currentReviewIndex),[currentReviewIndex]);
在正文中测试状态是否正在更新或不太容易。
const IndexPage = () => {
  const metaData = useStaticQuery(graphql`
    query {
      allMarkdownRemark {
        edges {
          node {
            frontmatter {
              name
            }
            html
          }
        }
      }
      site {
        siteMetadata {
          title
          locations
          profileIntroduction
        }
      }
    }
  `)

  const [reviewsArray] = useState(
    metaData.allMarkdownRemark.edges
  )

  const [currentReviewIndex, setCurrentReviewIndex] = useState(0)

  const [currentReview] = useState(
    reviewsArray[currentReviewIndex]
  )

  const increaseCurrentReview = () => {
    setCurrentReviewIndex(1)
  }

  return (
    <div>
        <Layout>
          <div 
          className='hero-image'
          style={{
            backgroundImage: `url(${heroImage1})`
          }}>
            <div className='home-hero-image-dark-cover'>
              <div className='home-hero-image-header'>
                {metaData.site.siteMetadata.title}
              </div>
              <div className='home-hero-image-header sub'>
                {metaData.site.siteMetadata.locations}
              </div>
            </div>
          </div>
          <div className='about-section'>
            <div className='about-section-image about-section-item'>
            </div>
            <div className='about-section-text about-section-item'>
              <div className='about-section-header'>
                {metaData.site.siteMetadata.title}
              </div>
              <p>
                {metaData.site.siteMetadata.profileIntroduction}
              </p>
            </div>
          </div>
          <div className='client-testimonials-section'>
            <div className='client-testimonials-section-dark-cover'>
              <button id='left-arrow' className='left-arrow arrow'>
                {'<'}
              </button>
              <div>
                <div className='client-testimonials-section-header'>
                  Client Testimonials
                </div>
                <div 
                className='client-testimonials-section-header review'
                dangerouslySetInnerHTML={{__html: currentReview.node.html}}
                >
                </div>
                <div className='client-testimonials-section-header review'>
                  - {currentReview.node.frontmatter.name}
                </div>
              </div>
              <button id='right-arrow' 
              className='right-arrow arrow' 
              onClick={increaseCurrentReview}>
                {'>'}
              </button>
            </div>
          </div>