古腾堡使用ServerSideRender渲染ACF块保持在编辑视图中加载

Question

我在ACF和古腾堡遇到一个奇怪的问题。我想用React块扩展一些ACF功能。

我目前有此设置：

Block.js

edit: ( props ) => {
    return (
        <ServerSideRender
            block="acf/acf-latest-posts"
        />
    );
},

ACF块.php文件

<?php

add_action('acf/init', 'acf_posts_init');

function acf_posts_init() {
    if( function_exists('acf_register_block') ) {
        acf_register_block([
            'name'            => 'acf-latest-posts',
            'title'           => __('ACF Latest Posts'),
            'description'     => __('Latest posts made with ACF'),
            'render_callback' => 'acf_posts_render_callback',
            'category'        => 'common',
            'icon'            => 'shield',
            'keywords'        => ['blog', 'posts'],
        ]);
    }
}

function acf_posts_render_callback( $block ) {
    echo '<h1>Test</h1>';
}

块已成功在编辑视图中加载，但显示如下：

当我发布页面时，它会按原样加载块。出于某种原因，只有编辑视图停留在加载屏幕上。

帮助表示感谢！