亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Gatsby 函數返回未定義

Gatsby 函數返回未定義

慕蓋茨4494581 2022-10-27 15:30:35
我有一個文件,我嘗試在其中確定應該在 Gatsby 模板中使用哪些數據。我得到一個包含子頁面的數組作為回報,這些子頁面可能包含其他子頁面。我想支持最多三個級別的子頁面。我有一個模板,我在其中使用我的分頁器(用于查找正確頁面的組件),我尋找正確的頁面以通過來自 gatsby-node.js 的 pageContext 繞過 slug模板(減去進口)const projectsSubPages = ({ data, pageContext }) => {  return (    <Layout>      <Menu parentPage={pageContext.parentSlug} />      {data.allSanityProjects.edges.map((childNode) =>        <>          {childNode.node.childPages.length > 0 &&            <Paginator              pageData={childNode.node.childPages}              parentPage={pageContext.parentSlug}              key={childNode.node._id}            />          }        </>      )}    </Layout>  );};export const query = graphql`{  allSanityProjects {    edges {      node {        childPages {          _rawBlockContent          title          slug          childPages {            slug            title            childPages {              title              slug              childPages {                slug                title                _key              }              _key            }            _key          }          _key        }        _key      }    }  }}`;export default projectsSubPages;我的分頁器組件(減去導入)   const subPageLevelFinder = ({ pageData, parentPage }) => {  const SubLevels = () => {    let pageLevel = "test";    if (pageData.slug === parentPage) {      pageLevel = pageData.slug    }    if (pageData.childPages && pageData.childPages.length > 0) {      pageData.childPages.map((secondLevel) => {        if (secondLevel.slug === parentPage) {          pageLevel = secondLevel.slug          return (pageLevel)        } 有關 GraphQL 查詢和 gatsby-node.js 的返回,請參閱此要點 https://gist.github.com/AndreasJacobsen/371faf073a1337b6879e4fd6b860b26f我的目標是在我的分頁器中運行一個具有模板的組件,并從 SubLevels 函數傳遞此模板應使用的數據,但此函數每次都返回第一個 set 值。所以我所有的 if 語句都失敗了,我不知道問題出在哪里,我嘗試過多次更改 if 參數,但這似乎適合 GraphQL 查詢
查看完整描述

1 回答

?
米脂

TA貢獻1836條經驗 獲得超3個贊

事實證明,錯誤來自我試圖訪問多維數組中的數組元素。


所以我得到的數組有三個元素,都帶有一個 slug。我試圖訪問蛞蝓,但為了得到蛞蝓,我不得不遍歷元素。


請參閱有效的附加解決方案(但效率不高),請注意此解決方案在最頂層具有地圖功能;這解決了這個問題。


import React from "react";

import SubPageTemplate from "./subPageTemplate";

import { Link } from "gatsby";


import { useStaticQuery, graphql } from "gatsby";


const BlockContent = require("@sanity/block-content-to-react");


const subPageLevelFinder = ({ pageData, parentPage, childSlug }) => {

  const subLevels = () => {

    let pageLevel = null;

    pageData.map((mappedData) => {

      if (mappedData.slug === childSlug) {

        pageLevel = mappedData;

        return pageLevel;

      } else {

        if (mappedData.childPages && mappedData.childPages.length > 0) {

          if (mappedData.slug === childSlug) {

            return (pageLevel = mappedData);

          } else {

            mappedData.childPages.map((secondLevel) => {

              if (secondLevel.slug === childSlug) {

                pageLevel = secondLevel;

                return pageLevel;

              } else if (

                mappedData.childPages.childPage &&

                mappedData.childPages.childPages.length > 0

              ) {

                secondLevel.childPages.map((thirdLevel) => {

                  if (thirdLevel.slug === childSlug) {

                    pageLevel = thirdLevel;

                    return pageLevel;

                  }

                });

              }

            });

          }

        } else {

          return false;

        }

      }

    });


    return pageLevel;

  };


  return <>{subLevels() && <SubPageTemplate pageLevel={subLevels()} />}</>;

};


export default subPageLevelFinder;


查看完整回答
反對 回復 2022-10-27
  • 1 回答
  • 0 關注
  • 109 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號