ACF 6中ACF块的新增功能

文档 ACF块 ACF 6中ACF块的新增功能

概述

ACF 6.0包括ACF块版本2。下一代ACF块使我们更接近于本机块体验，同时也为您提供了WordPress开发人员所熟悉的基于PHP的模板语言。

在WordPress的最近几次发布中，Gutenberg对块编辑器和块注册的各个方面进行了重大更改，这对ACF块产生了影响。由于向后兼容性的原因，我们无法像我们希望的那样快速地实施更改以支持这些新功能。ACF 6.0附带了一个新的块版本控制系统，允许您选择使用新版本，这将改变诸如ACF块在后端和前端的标记和结构之类的内容，并且可能需要更新您的主题才能支持。

向后兼容性

ACF 6.0中对块的更改旨在向后兼容ACF 5.x，但有一个明显的例外。由于块ID，如果您使用解析块（）要从ACF块中读取数据，该块中不再存在块ID。为了解决这个问题，请参阅我们的示例用于重新添加块ID。

虽然我们推荐用户升级到block.json块为了尽可能利用WordPress的新功能和即将推出的功能acf寄存器块类型（）将继续与ACF 6合作。

Block.json支持

自WordPress 5.8以来，WordPres支持并建议通过JSON配置文件注册块。所有WordPress块文档已迁移为仅显示块.json配置对象，用户很难知道哪些WordPress配置选项在ACFPRO中可用。ACF 6.0引入了对块.json向ACF登记区块。

对于通过块.json文件，您可以通过向JSON文件添加新的ACF配置密钥将其标记为ACF块，该文件包含ACF特定的配置，例如：

{“name”：“all-fields-block”，“title”：“所有字段测试块”，“description”：“所有字段测试块”，“style”：“file:./all-fields-block.css”，“类别”：“主题”，“icon”：“管理员意见”，“apiVersion”：2，“关键字”：[“测试”，“报价”],“acf”：{“mode”：“预览”，“renderTemplate”：“all-fields-block.php”，“postTypes”：[“post”]},“样式”：[{“名称”：“默认”，“标签”：“缺省”，“isDefault”：true}，{“name”：“red”，“label”：“red”}，{“name”：“green”，“label”：“green”}，{“name”：“blue”，“label”：“blue”}],“支架”：{“对齐”：true，“锚点”：正确，“alignContent”：false，“颜色”：{“文本”：true，“background”：正确，“link”：真},“alignText”：true，“间距”：{“保证金”：[“顶部”，“底部”],“padding”：true},“排版”：{“lineHeight”：真，“fontSize”：true},“全高”：真},“属性”：{“背景颜色”：{“type”：“字符串”，“default”：“紫色”}},“示例”：{“属性”：{“数据”：{“text”：“这是一个示例文本字段”，“text_area”：“这是一个示例文本区域字段”}}}}

然后你需要使用标准的WordPress块注册功能 寄存器块类型，而不是acf寄存器块类型:

register_block_type（'path/to/folder/containing/block.json'）；

如果您没有像上面的例子那样为您的块指定命名空间：“name”：“all-fields-block”，，如果它是ACF块，ACF将自动添加它，使其等效于“name”：“acf/all-fields-block”尽管现在您可以为块使用自己的名称空间。

这种注册块的新方法现在是注册块的推荐方法，它取代了acf寄存器块类型功能。

这个renderTemplate（渲染模板）属性应该是模板文件的完整路径，或者相对于JSON文件的位置。

现在还可以为块指定默认属性，如上面的示例所示属性键。您可以使用它为WordPress提供的块属性设置默认值，例如背景色.

WordPress在JSON文件中使用camelCase格式，ACF也采用了这种格式。配置键，如渲染器_模板在中使用时acf寄存器块类型需要渲染模板在JSON中使用时，同样对齐内容和全高（_H）应该是对齐内容和全高例如。支持所有以前的配置对象，除了排队风格，enqueue_script（排队脚本）和排队资产原因如下：

阻止资产加载

首次引入ACF块时，它支持在WordPress获得本机支持之前对块特定资产进行排队。Gutenberg最近（和即将到来的）更新将要求使用特定的WordPress资产配置键例如编辑器脚本，脚本，编辑器样式和风格.

使用块样式的WordPress 5.9用户可能已经注意到，ACF样式注册并没有应用于这些预览，这就是为什么所有ACF块用户都应该迁移他们的块，以使用WordPres提供的资产加载方法。

ACF块中先前的资产加载方法将暂时在acf寄存器块类型，但随着WordPress在各个版本中不断进行更改，我们预计这将停止工作，尤其是即将到来的计划隔离iframe中的每个块。

块ID更改

ACF 6.0不再将块ID保存到ACF块的块注释中。这会影响所有版本的ACF块，意味着您可以轻松复制和粘贴块、简化后期类型模板、在块模式中使用块或复制块，而不会出现块ID冲突的问题。

此更改不应该影响大多数用户，因为我们仍然生成$块['id']我们知道有些用户将其用于元素ID，但这些ID的格式将发生变化。就像在ACF 5.x中一样，块ID可能会重复，但发生这种情况的情况已经大大减少到一个：如果在同一页面上有多个块，它们具有完全相同的数据、属性和上下文。

由于动态块ID生成，此更改对大多数用户都是向后兼容的，除非您使用解析块（）读取ACF数据，并依赖它返回块ID。

在内部，ACF根据块属性和上下文的md5散列构建新的动态块ID，但由于WordPress块上下文在中可能不可用解析块（）因此，您将无法可靠地将我们的动态块ID与解析块（）.

有几个选项可以解决这个问题。您可以通过排序数据属性的校验和生成自己的散列，使用用户输入的锚，或者您可以在每次使用acf/预保存块过滤器。

以下是几个可能的示例，如果用户没有输入锚属性，第一个示例将自动生成锚属性：

添加筛选器('acf/pre_save_block'，函数（$属性）{if（空（$attributes['anchor']）{$attributes['anchor']='acf-block-'。uniqid（）；}返回$attributes；});

或者，您可以生成一个新的自定义ID属性，如果设置了该属性，也可以在前端使用，但请注意，每次保存块时都会重新生成该属性，并且该ID不会在后端编辑器中使用：

添加筛选器('acf/pre_save_block'，函数（$属性）{if（空（$attributes['id']）{$attributes['id']='acf-block-'。uniqid（）；}返回$attributes；});

块版本控制详细信息

一个新的块版本（在ACF键内块.json)或acf块版本（如果使用acf寄存器块类型)现在支持键。对于通过注册的块块.json，默认为2。对于acf寄存器块类型，默认为1.

目前，两个版本之间的主要变化是<内部块/>将呈现标记。如果使用块版本2（需要WordPress 5.8+），则使用InnerBlocks时的容器标记将在后端和前端渲染之间匹配，任何内部块都封装在新的（和单层）中<div class=“acf-inner-blocks-container”>元素。这有助于简化CSS布局，因为可以确保两个渲染视图具有相同的标记。

虽然此包装必须出现在后端块编辑器中，但如果您希望为前端禁用它，则可以使用新的筛选器进行此操作，并可以根据块名称启用或禁用它：

add_filter（'acf/blocks/wrap_frontend_innerblocks'，'acf_should_wrap_innerbooks'，10，2）；函数acf_should_wrap_innerblocks（$wrap，$name）{if（$name=='acf/test-block'）{返回true；}返回false；}

如果您只想修改包装器使用的类，而不是默认类acf内块容器您可以简单地将类添加到您的<内部块/>块模板中的标记，例如…

<InnerBlocks class=“test-wrapper-class二等”/>

块注册表标准化

在ACF PRO的早期版本中，块配置的轻量级填充程序在PHP中注册，然后在JS中注册完整配置。

在这个ACF版本中，完整的块配置现在保存在WordPress PHP块注册表中。这使您更容易访问模板或渲染回调中块配置的详细信息。

块上下文更改

在开发过程中，我们在twitter上看到了一个对话，讨论了在其包含的块中使用来自ACF块的数据的可行性<内部块>儿童。

我们怀疑使用块上下文，系统核心块（如Query Loop块）用于了解当前的post类型。

ACF 6.0引入了对块上下文的支持。这意味着，如果要将ACF字段数据从父块传递到InnerBlock，InnerBlock将自动重新加载模板，在您更改父块中的字段时实时显示更改。这种支持还应该提高Query Loop块中使用的块的可靠性。

要启用此功能，您需要告诉WordPress共享ACF数据属性设置为具有自定义键的子块(acf/字段在我们的示例中）提供上下文在block.json中：

“providesContext”：{“acf/fields”：“data”}

然后，要在ACF块中使用该上下文，需要在使用上下文:

“usesContext”：[“acf/fields”]，

需要注意的一点是：ACF块在块编辑器中使用字段键，块数据仅在保存时水合为字段名。因此，您应该使用$context['acf/fields']['field_key']获取模板中的数据（如果存在），然后返回默认值$context['acf/fields']['field_name']如果它不支持上下文数据的后端和前端输出。

您还应该注意，如果通过子块共享ACF数据，则完整的ACF字段数据将发送回服务器，以便渲染预览。这可能会对编辑器中的块产生性能影响。

没有字段的块

使用Full Site Editing和Query Loop块，您现在更可能希望使用没有附加任何特定字段的ACF块，例如，因为它显示的是标题或帖子内容等帖子模板元素，或者因为您希望显示添加到所显示帖子上的字段，而不是从街区。

ACF 6.0增加了对这一点的支持，它在块没有指定字段时提供了提示文本，而以前块的编辑模式只是空白且不可选。

希望修改默认咨询文本的开发人员可以使用新的acf/blocks/no字段分配消息提供两个参数的过滤器：要显示的消息和它将显示的块的名称。

阻止错误修复

我们还修复了适用于所有版本ACF块的许多其他错误。

• 这个渲染块预览JavaScript事件现在总是在每次显示块预览时触发，而不仅仅是第一次。
• ACF块中的手风琴字段现在的样式与块编辑器的本地边栏体验相匹配。
• ACF块预加载现在再次适用于在编辑模式下保存的块，以及没有任何保存字段数据的块（由于块预加载中为删除块ID而进行的更改，您可能需要在预加载每个块之前编辑一次。）
• 如果加载时不可见，ACF块编辑表单现在将正常工作。