gutenberg-docs/docs/how-to-guides/block-tutorial
2026-03-27 01:08:43 +08:00
..
applying-styles-with-stylesheets.md docs: add 183 translated files 2026-03-27 01:08:43 +08:00
creating-dynamic-blocks.md docs: add 183 translated files 2026-03-27 01:08:43 +08:00
extending-the-query-loop-block.md docs: add 183 translated files 2026-03-27 01:08:43 +08:00
nested-blocks-inner-blocks.md docs: add 183 translated files 2026-03-27 01:08:43 +08:00
README.md docs: add 183 translated files 2026-03-27 01:08:43 +08:00

title post_status comment_status taxonomy
区块 publish open
category post_tag
gutenberg-docs
Block Tutorial
How To Guides
Repos

区块

本教程旨在逐步讲解创建新区块类型的基础知识。从最简单的示例开始,每个新章节将逐步构建,涵盖您在实现自己的区块类型时可能需要的大部分常见功能。

要跟随本教程学习,您可以下载配套的 WordPress 插件,其中包含所有示例供您在自己的网站上尝试。在每个步骤中,尝试用自己的想法修改示例,并观察它们对区块行为的影响。

要查找 .zip 文件的最新版本,请访问仓库的发布页面并在最新版本的“Assets”下查找。

代码片段以两种格式提供“JSX”和“Plain”。JSX 指使用 JSX 语法的 JavaScript 代码需要构建步骤。Plain 指不需要构建的“经典”JavaScript。您可以使用每个代码示例上方的选项卡在两者之间切换。使用 JSX 确实需要您运行 JavaScript 构建步骤 将代码编译为浏览器兼容的格式。

请注意,创建区块或扩展编辑器并不要求使用 JSX您可以使用经典 JavaScript。然而一旦熟悉了 JSX 和构建步骤,许多开发者往往会发现它更易于读写,因此您找到的大多数代码示例都使用 JSX 语法。