0

我是 Prismic 的新手,并尝试使用它来拉页面PrismicDOM.RichText.asText并且它有效,但是当我尝试使用 显示一个部分/字段asHtml时,它显示一个文字 html 代码。一直在搜索文档并尝试了HTML 序列化器,但仍然无法正常工作。也许我错过了什么。

<script>
import Prismic from "prismic-javascript";
import PrismicConfig from "~/prismic.config.js";
import PrismicDOM from "prismic-dom";
import linkResolver from "~/plugins/link-resolver.js";
import htmlSerializer from "~/plugins/html-serializer.js";

export default {
  async asyncData({ context, error, req }) {
    try {
      const api = await Prismic.getApi(PrismicConfig.apiEndpoint, { req });

      let document = {};
      const result = await api.getSingle("homepage");
      document = result.data;
      const title = PrismicDOM.RichText.asText(document.title);
      const desc = PrismicDOM.RichText.asText(document.summary);
      const cta = PrismicDOM.RichText.asHtml(document.job_extra, linkResolver, htmlSerializer); //Display as Html

      if (process.client) window.prismic.setupEditButton();

      return {
        document,
        title,
        cta,
        desc,
        documentId: result.id
      };
    } catch (e) {
      error({ statusCode: 404, message: "Page not found" });
    }
  }
};
</script>
4

1 回答 1

2

您还必须定义一个HTML 序列化程序并将其传入:

import PrismicDOM from 'prismic-dom'
import Prismic from 'prismic-javascript'
import PrismicConfig from '~/prismic.config.js'
import linkResolver from '~/plugins/link-resolver.js'
import htmlSerializer from '~/plugins/html-serializer.js'

  async asyncData({ params, error, req }) {
    try {
      // Fetching the API object
      const api = await Prismic.getApi(PrismicConfig.apiEndpoint, { req })
      // Query to get the home page content
      let post = {};
      const result = await api.getByUID('post', params.slug);
      post = result.data;

      const body = PrismicDOM.RichText.asHtml(
        post.body,
        linkResolver,
        htmlSerializer
      )

      return {
        // Event item content
        post,
        body
      }
    } catch (e) {
      error({ statusCode: 404, message: 'Page not found' })
    }
  },
于 2020-11-26T06:27:29.727 回答