假设包含一个核心/库块,我想在其中自己渲染。如何在服务器端渲染中获取库ID或图像ID。php?
块js公司:
const { Gallery, InspectorControls, InnerBlocks } = wp.blockEditor;
const { registerBlockType } = wp.blocks;
const { Button, PanelBody, TextControl } = wp.components;
const ALLOWED_BLOCKS = [\'core/gallery\'];
const MY_TEMPLATE = [
[\'core/gallery\', { placeholder: \'Gallery\' }],
];
registerBlockType(\'my-gallery-block/main\', {
title: \'My Gallery\',
icon: \'dashicons-format-gallery\',
category: \'my-blocks\',
attributes: {
htmlId: {
type: \'string\'
},
galleryIds: {
type: \'string\'
}
},
edit({ attributes, className, setAttributes }) {
return (<div>
<div className="button-container">
Gallery Block
<InnerBlocks
allowedBlocks={ALLOWED_BLOCKS}
template={MY_TEMPLATE}
templateLock="all"
></InnerBlocks>
</div>
<InspectorControls>
<PanelBody
title="Settings"
initialOpen={true}
>
<TextControl
label="HTML ID"
help="(optional)"
value={attributes.htmlId}
onChange={(content) => setAttributes({ htmlId: content })}
/>
</PanelBody>
</InspectorControls>
</div>);
},
save() {
return (<InnerBlocks.Content />);
}
});
提供php:
<?php function render_gallery_block( $attributes, $content ) {
// How do I get the gallery ID or the Image IDs within the gallery?
ob_start();
?>
<?php
$output = ob_get_contents(); // collect output
ob_end_clean(); // Turn off ouput buffer
return $output; // Print output
}
我知道
$content
变量已将渲染的库块包含为HTML字符串,但我希望尽可能避免从HTML字符串中提取图像URL。
有人知道更好的方法吗?
最合适的回答,由SO网友:stokesman 整理而成
使用render_block
过滤器(与使用自定义块包装块相反)是实现所需功能的更简单方法。过滤器针对所有块运行,因此您必须有条件地将逻辑仅应用于所需的块。每个块的属性将可用($block[attrs]
) 对于当前核心/库块images
属性将具有所需的数据。
需要注意的是,库块正在迁移为使用嵌套图像块,并且不再在其自身的属性中保留图像列表。这将出现在5.9版本中。
即便如此render_block
过滤器可用于此,但不必检查要迭代的块属性$block[\'innerBlocks\']
获取图像ID。
如果有帮助的话,这里是初学者代码段,其中有一个基本条件,即只影响具有特定类的库块。
add_filter( \'render_block\', function ( $block_content, $block ) {
if (
$block[\'blockName\'] === \'core/gallery\'
&& $block[\'attrs\'][\'className\'] === \'is-rad\'
) {
// $block also has \'innerBlocks\'
$block_content = \'whiz bang\';
}
return $block_content;
}, 10, 2 );