手风琴项目

将标题和面板包裹在一个单元中。

• 名称: core/accordion-item
• 类别: 设计
• API 版本: 3
• 块类型: 混合（静态保存 + 服务器增强）

块关系

父级块（直接）:
– core/accordion

允许的内部块:
– core/accordion-heading
– core/accordion-panel

属性

通过 attributes 属性在 block.json 中定义。

支持

通过 supports 属性在 block.json 中定义。

• html: false
• background:
  • gradients: true
• color:
  • background: true
  • gradients: true
  • link: true
  • heading: true
  • button: true
• interactivity: true
• spacing:
  • margin: ["top","bottom"]
  • padding: true
  • blockGap: true
• shadow: true
• layout:
  • allowEditing: false
• typography:
  • fontSize: true
  • lineHeight: true
• contentRole: true

上下文

通过 usesContext 和 providesContext 属性在 block.json 中定义。

提供上下文:

• core/accordion-open-by-default → 属性 openByDefault

块标记

这是一个 混合块。它保存静态标记，服务器在渲染期间可能会对其进行增强。

<!-- wp:accordion-item -->
<div class="wp-block-accordion-item">
    <!-- wp:accordion-heading -->
    <h3 class="wp-block-accordion-heading has-icon has-icon-right">
        <button type="button" class="wp-block-accordion-heading__toggle"><span class="wp-block-accordion-heading__toggle-title">折叠面板标题</span><span class="wp-block-accordion-heading__toggle-icon" aria-hidden="true">+</span></button>
    </h3>
    <!-- /wp:accordion-heading -->
    <!-- wp:accordion-panel -->
    <div role="region" class="wp-block-accordion-panel">
        <!-- wp:paragraph -->
        <p>折叠面板内容</p>
        <!-- /wp:paragraph -->
    </div>
    <!-- /wp:accordion-panel -->
</div>
<!-- /wp:accordion-item -->

来源

• block.json (参考)
• 源目录 — 浏览 edit 和 save 源文件、index.php 等。