此包为 DataView 库提供了核心元素,旨在简化 WordPress 中数据展示元素的创建和管理。

安装

安装模块

npm install @wordpress/fields --save

设置

此包需要来自本包及多个依赖包的 CSS。

在 WordPress 内部

为确保正确的加载顺序,请将 wp-components 样式表添加为您的插件样式表的依赖项。有关如何指定依赖项的信息,请参阅 wp_enqueue_style 文档。

WordPress 未为此包自己的样式表注册句柄,因此请使用您的插件脚本加载它:

import '@wordpress/fields/build-style/style.css';

在 WordPress 外部

在您的应用程序中安装并加载这些样式表:

npm install @wordpress/fields @wordpress/theme @wordpress/components
import '@wordpress/theme/design-tokens.css';
import '@wordpress/components/build-style/style.css';
import '@wordpress/fields/build-style/style.css';

样式表的 RTL 版本位于相同的路径中,但文件名后附加了 -rtl(style-rtl.css)。设计令牌样式表是通用的,没有单独的 RTL 版本。

用法

authorField

BasePost 的作者字段。

BasePost

未记录的声明。

BasePostWithEmbeddedAuthor

未记录的声明。

commentStatusField

BasePost 的评论状态字段。

CreateTemplatePartModal

一个 React 组件,用于渲染创建模板部分的模态框。该模态框显示标题和创建模板部分的内容。此组件不应存在于本包中,而应移至专门负责管理模板的专用包中。

参数

  • props { modalTitle?: string; } & CreateTemplatePartModalContentsProps: 组件属性。
  • props.modalTitle { modalTitle?: string; } & CreateTemplatePartModalContentsProps[ 'modalTitle' ]:

dateField

BasePost 的日期字段。

deletePost

模板、模式和模板部分的删除操作。

descriptionField

模板的描述字段。

discussionField

带有自定义渲染逻辑的 BasePost 的讨论字段。

duplicatePattern

模式的重复操作。

duplicatePost

BasePost 的重复操作。

duplicateTemplatePart

TemplatePart 的重复操作。

excerptField

BasePost 的摘要字段。

exportPattern

以 JSON 格式导出模式的操作。

featuredImageField

BasePostWithEmbeddedFeaturedMedia 的特色图像字段。

formatField

BasePost 的格式字段。

lastEditedDateField

BasePost 的最后编辑日期字段。

MediaEdit

一个媒体编辑控件组件,提供带有上传功能的媒体选择器 UI,用于选择 WordPress 媒体附件。支持传统的 WordPress 媒体库和实验性的 DataViews 媒体模态框。

此组件旨在用作使用 @wordpress/editor 中的 registerEntityField 注册字段时的字段定义中的 Edit 属性。

用法

import { MediaEdit } from '@wordpress/fields';
import type { DataFormControlProps } from '@wordpress/dataviews';

const featuredImageField = {
    id: 'featured_media',
    type: 'media',
    label: 'Featured Image',
    Edit: ( props: DataFormControlProps< MyPostType > ) => (
        <MediaEdit { ...props } allowedTypes={ [ 'image' ] } />
    ),
};

参数

  • props MediaEditProps<Item>: – 组件属性。
  • props.data Item: – 正在编辑的项目。
  • props.field Object: – 包含 getValue 和 setValue 方法的字段配置。
  • props.onChange Function: – 媒体选择更改时的回调函数。
  • props.allowedTypes [string[]]: – 允许的媒体类型数组。使用 ['*'] 允许所有文件类型。默认值为 ['image']。
  • props.multiple [boolean]: – 是否允许多个媒体选择。默认值为 false。
  • props.hideLabelFromVision [boolean]: – 是否从视觉中隐藏标签。
  • props.isExpanded [boolean]: – 是否以展开形式渲染。默认值为 false。

返回

  • React.JSX.Element: 媒体编辑控件组件。

MediaEditProps

未记录的声明。

notesField

支持 editor.notes 的文章类型的注释计数字段。

orderField

BasePost 的顺序字段。

pageTitleField

页面实体的标题。

parentField

BasePost 的父级字段。

passwordField

BasePost 的密码字段。

Pattern

未记录的声明。

patternDescriptionField

模式的描述字段。

patternSyncStatusField

模式的同步状态字段。

patternTitleField

模式实体的标题。

permanentlyDeletePost

PostWithPermissions 的永久删除操作。

pingStatusField

BasePost 的 Ping 状态字段。

postContentInfoField

BasePost 的文章内容信息字段。

postsPageTitleField

文章页面(分配为 page_for_posts 的 page)的标题字段。

postsPerPageField

root/site 实体的每页文章数字段。

PostType

未记录的声明。

readOnlyDescriptionField

主题提供的模板的只读描述字段,无法编辑。与 descriptionField 共享显示配置,但呈现为只读状态,且仅在存在描述时可见。

类型

  • Field< Template >

renamePost

PostWithPermissions 的重命名操作。

reorderPage

BasePost 的重排序操作。

resetPost

模板和模板部分的重置操作。

restorePost

PostWithPermissions 的恢复操作。

scheduledDateField

计划日期字段。

siteDiscussionField

root/site 实体的讨论字段。

slugField

BasePost 的别名字段。

statusField

BasePost 的状态字段。

stickyField

BasePost 的置顶字段。

templateAuthorField

模板的作者字段。

类型

  • Field< Template >

templateField

BasePost 的模板字段。

templatePartAuthorField

模板部分的作者字段。

类型

  • Field< TemplatePart >

templateTitleField

模板实体的标题。

titleField

具有 title 属性的任何实体的标题。对于模式、页面或模板,您应该使用各自的字段,因为在渲染、标签等方面存在一些差异。

trashPost

PostWithPermissions 的回收站操作。

viewPost

BasePost 的查看文章操作。

viewPostRevisions

文章的查看文章修订操作。

为此包做出贡献

这是 Gutenberg 项目的一部分独立包。该项目组织为一个 monorepo。它由多个自包含的软件包组成,每个包都有特定的用途。此 monorepo 中的包发布到 npm,并被 WordPress 以及其他软件项目使用。

要了解有关为此包或整个 Gutenberg 做出贡献的更多信息,请阅读项目的主要 贡献者指南。