Lexical 转换器

Richtext 字段以 JSON 格式存储数据 - 这种格式既便于存储又具有灵活性，同时可以轻松转换为其他格式：

获取编辑器配置

某些转换器需要访问 Lexical 编辑器配置，该配置定义了可用功能和行为。Payload 通过 @payloadcms/richtext-lexical 中的 editorConfigFactory 提供了多种获取编辑器配置的方式。

导入工厂函数

首先导入必要的工具：

import type { SanitizedConfig } from 'payload'
import { editorConfigFactory } from '@payloadcms/richtext-lexical'

// 需要获取你的 Payload 配置才能检索默认编辑器配置
const config: SanitizedConfig = {} as SanitizedConfig

选项 1：默认编辑器配置

如果需要获取默认编辑器配置：

const defaultEditorConfig = await editorConfigFactory.default({ config })

选项 2：从 Lexical 字段提取

当有可用的 lexical 字段配置时，可以直接从中提取编辑器配置：

const fieldEditorConfig = editorConfigFactory.fromField({
  field: config.collections[0].fields[1],
})

选项 3：创建自定义编辑器配置

你可以通过指定额外功能来创建自定义编辑器配置：

import { FixedToolbarFeature } from '@payloadcms/richtext-lexical'

const customEditorConfig = await editorConfigFactory.fromFeatures({
  config,
  features: ({ defaultFeatures }) => [
    ...defaultFeatures,
    FixedToolbarFeature(),
  ],
})

选项4：从已实例化的编辑器中提取

如果你已经创建了一个全局或可复用的 Lexical 编辑器实例，你可以访问其配置。这种方法通常效率较低，不建议使用：

const editor = lexicalEditor({
  features: ({ defaultFeatures }) => [
    ...defaultFeatures,
    FixedToolbarFeature(),
  ],
})

const instantiatedEditorConfig = await editorConfigFactory.fromEditor({
  config,
  editor,
})

为了获得更好的效率，建议将 features 提取到一个单独的变量中，并使用 fromFeatures 方法替代此方式。

示例 - 从现有字段中获取编辑器配置

如果你可以访问已清理的 collection 配置，你可以获取 lexical 清理后的编辑器配置，因为每个 lexical richText 字段都会返回它。以下是一个如何从另一个字段的 afterRead 钩子中获取它的示例：

import type { CollectionConfig, RichTextField } from 'payload'

import {
  editorConfigFactory,
  getEnabledNodes,
  lexicalEditor,
} from '@payloadcms/richtext-lexical'

export const MyCollection: CollectionConfig = {
  slug: 'slug',
  fields: [
    {
      name: 'text',
      type: 'text',
      hooks: {
        afterRead: [
          ({ siblingFields, value }) => {
            const field: RichTextField = siblingFields.find(
              (field) => 'name' in field && field.name === 'richText',
            ) as RichTextField

            const editorConfig = editorConfigFactory.fromField({
              field,
            })

            // 现在你可以使用编辑器配置了

            return value
          },
        ],
      },
    },
    {
      name: 'richText',
      type: 'richText',
      editor: lexicalEditor(),
    },
  ],
}