首页 > 解决方案 > 如何在古腾堡渲染额外的复选框?

问题描述

我想在裁剪图像旁边添加一个额外的复选框,但我不明白需要用 javascript 编写什么来渲染和处理它。我找不到解释这一点的文档。我试过写这样的代码,但没有用:

function addListBlockClassName (settings, name) {
  if (name !== 'core/gallery') {
    return settings
  }

  // new checkbox
  settings.attributes.enableVoting = {
    default: false,
    type: 'boolean',
  }

  return settings
}

wp.hooks.addFilter(
  'blocks.registerBlockType',
  'my-plugin/class-names/list-block',
  addListBlockClassName
)

标签: wordpresswordpress-gutenberggutenberg-blocks

解决方案


您可以使用InspectorControls和在侧边栏添加额外的复选框Checkbox Control

查看图库块并了解如何通过 using 实现侧边栏上的内容InspectorControls。这可能很复杂,因此为了更容易实现,您可以查看 Gutenberg 的其他核心块。

这个链接可以帮助您了解如何使用CheckboxControl.

在上面的代码中,您只是添加了一个钩子,该钩子正在更改块库的默认类名,这不是您要问的。请注意,据我所知,除非您复制整个核心块并在其中添加其他功能,否则您无法编辑默认核心块(除了很少的东西)。


推荐阅读