首页 > 解决方案 > Sanity Studio 中 LaTex 和表格的序列化程序出现问题 - 未出现在 React 应用程序的前端

问题描述

使用 Sanity Studio 构建 React 应用程序,我在 Sanity Studio 中自定义了文本编辑器以具有代码块。我从 Sanity 文档中安装了 LaTex 和 Table 插件。下面我添加了块:

{
      name: 'Table',
      title: 'Size Chart',
      type: 'table', // Specify 'table' type
    },
    {
      type: 'image',
      options: {hotspot: true},
    },
    { type: 'latex', title: 'Inline math' },
    { type: 'latex', name: 'anotherAuthor', title: 'Math block' },
    {
      type: 'code'
    }

这导致能够在 Sanity Studio 中添加代码 / LaTex / 和表格。对于 react 的前端,我为代码创建了一个序列化器类型:

const serializers = {
  
  types: {

code: (props) => (
  <SyntaxHighlighter
    language={props.node.language}
    style={coldarkDark}
    showLineNumbers
    lineNumberStyle={{
      padding: "0 5px 0 0",
      fontSize: 14,
      borderRight: "1.5px solid darkgray",
      marginRight: "10px",
    }}
  >
    {props.node.code}
  </SyntaxHighlighter>


  ),
  }
};

当我在 Reach 端运行应用程序时,这会导致代码块出现语法,但是我无法弄清楚如何为 LaTex 或 Table 正确声明序列化程序,并且它们目前在我的网站上显示为空白。有任何想法吗?

标签: javascriptreactjsserializationlatexsanity

解决方案


推荐阅读