对类型的健全参考来自 'reference'

Sanity reference to type comes as 'reference'

在 Sanity 中我有这个字段:

{
  name: 'reference',
  type: 'reference',
  title: 'Link Reference',
  to: [
    { type: 'post' }, { type: 'questionPost' }, { type: 'linkCategory' }, { type: 'information' }
    // other types you may want to link to
  ]
},

在 CMS 中提示为 link 选择器,我选择了 link。然后在 graphql 中是:

"reference": 
{
          "_ref": "1a558cde-16fb-4362-8082-634468a1cc20",
          "_type": "reference"
},

问题是,在我的前端组件中,当我执行 reference._type 通常是 'post'、'questionPost'、'linkCategory' 或 'information' 但在另一个页面上reference._type 变成 'reference'。 您知道为什么有时 reference._type 是 'reference' 而不是 'post'、'questionPost' ...?

编辑:

所以我有一个 ctaWidget:

export default {
  name: "ctaWidget",
  type: "object",
  title: "CTA Widget",
  fields: [
    {
      name: "LeftSideText",
      type: "portableText",
      title: "Left side text"
    },
    {
      name: "text",
      type: "string",
      title: "Link text",
    },
    {
      name: 'reference',
      type: 'reference',
      title: 'Link Reference',
      to: [
        { type: 'post' }, { type: 'questionPost' }, { type: 'linkCategory' }, { type: 'information' }
        // other types you may want to link to
      ]
    },
  ],
  preview: {
  },
};

ctaWidget 是 Sanity 便携式文本 bioPortableText 的一部分:

 export default { name: "bioPortableText",
  type: "array",
  title: "Excerpt",
  of: [
    {
      type: "block",
      title: "Block",
      styles: [{ title: "Normal", value: "normal" }],
      lists: [],
      marks: {
        decorators: [
          { title: "Strong", value: "strong" },
          { title: "Emphasis", value: "em" },
          { title: "Code", value: "code" },
        ],
      },
    },
    {
      type: "mainImage",
      options: { hotspot: true },
    },
    {
      type: "mainVideo",
    },
    {
      type: "ctaWidget",
    },
    {
      type: "prosConsWidget",
    },
  ],
};

(在 CMS 中它看起来像: ctaWidget in bioPortable text) (当我点击 ctaWidget 时,link 参考看起来像:link reference) 获取 bioPortableText 的查询是:

export const query = graphql` query peopleTemplateQuery($id: String!) {
post: sanityPeople(id: { eq: $id }) {
  id
  publishedAt
  email
  slug {
    current
  }
  name
  jobTitle
  image {
    ...SanityImage
    alt
  }
  location {
    location
  }
  _rawBio
  feeStructure
  qualification {
    qualification
  }
  specialisations {
    specialisation
  }
}
dictionary: allSanityDictionary {
  nodes {
    key
    value
  }
}

} `;

_rawBio 我像这样传递给组件:

 {_rawBio && <PortableText blocks={_rawBio} />}

然后在序列化器中:

ctaWidget: ({ node }) => {
  if (node.LeftSideText === undefined) {
    return null;
  }
  else {
    return (<CtaWidget leftSideText={node.LeftSideText} linkTitle={node.text} reference={node.reference} />)
  }
},

然后在 CtaWidget 组件节点中。reference._type 应该是 'post' 或 'questionPost' 或 'linkCategory' 或 'information' 这样我就可以 node.reference.slug.current 得到 url。但是,node.reference._type 是 'reference' 而 node.reference 上没有 slug 属性...

您面临的问题是 _rawX 字段不会自动解析引用。也就是说,Sanity 为您提供了一种方法来告诉您希望在多深的位置解析引用。

export const query = graphql`
  query peopleTemplateQuery($id: String!) {
    post: sanityPeople(id: { eq: $id }) {
      id
      publishedAt
      email
      slug {
        current
      }
      name
      jobTitle
      image {
        ...SanityImage
        alt
      }
      location {
        location
      }
      _rawBio(resolveReferences: { maxDepth: 5 })
      feeStructure
      qualification {
        qualification
      }
      specialisations {
        specialisation
      }
    }
    dictionary: allSanityDictionary {
      nodes {
        key
        value
      }
    }

您需要指定适合您的数据结构的深度。

文档:https://www.sanity.io/docs/gatsby-source-plugin#raw-fields.