无法将动态古登堡块渲染到前端

时间:2019-01-15 作者:Philipp

我尝试了我在网上找到的一切。将显示后端,包括动态段(使用select等)。但最简单的“渲染回调”不会出现在前端。

插件。php

/**
 * Plugin Name: My Dynamic Block
 */

function my_plugin_render_dynamic_block( ) {
    return \'<h1>Sample Block</h1>\';
}

function register_dynamic_block() {
    wp_register_script(
        \'dynamic-block\',
        plugins_url( \'/dist/block.js \', __FILE__),
        array( \'wp-blocks\', \'wp-element\', \'wp-editor\' ),
        filemtime( plugin_dir_path( __FILE__ ) . \'dist/block.js\' )
    );

    register_block_type(
        \'my-plugin/dynamic-block\',
        [
            \'editor_script\' => \'dynamic-block\',
            \'render_callback\' => \'my_plugin_render_dynamic_block\',
        ]
    );
}
add_action(\'init\', \'register_dynamic_block\');
阻止。js公司

const { __ } = wp.i18n;
const { registerBlockType } = wp.blocks;

registerBlockType( \'my-plugin/dynamic-block\', {
    title: \'My Dynamic Block\',
    icon: \'megaphone\',
    category: \'widgets\',

    edit({attributes}) {
        return (
            <div>Content</div>
        );
    },

    save() {
        return null;
    },
} );

2 个回复
SO网友:Jay

由于您正在创建动态块,因此不需要在JavaScript中注册该块。看看最新的帖子,看看他们是如何做到这一点的。

SO网友:Ashiquzzaman Kiron

即使您确实使用null return来呈现前端,在下一页重新加载时,您也会得到块验证错误。因为编辑函数上的html结构与保存函数不匹配。所以

而不是

    save() {
        return null;
    },
试试看

     save() {
         return (
           <div>Content</div>
       );
    },
我希望这有帮助。

相关推荐