Gutenberg dynamic block render_callback gives null for $post

Question

I am trying to get the current post ID in the render_callback function to generate related posts. However, the global $post object gives null.

I use this code for example from here:

add_action( 'init', function() {
    register_block_type('fc/related-posts', array(
        'render_callback' => function() {
            global $post;
            var_dump($post); // null
        }
    ));
});

It will be fired on init but just $wp object works others like $wp_query or $post are null.

Answer 1

When you declare your block, you need to tell WP that it needs context, either by using usesContext in JS/JSON or uses_context in PHP.

E.g in PHP:

        'render_callback' => 'render_my_block',
        'uses_context' => [ 'postId' ],

This value then takes an array of context identifiers, e.g. postId which can then be grabbed in the edit component for rendering, or in PHP at runtime:

function render_my_block( array $attributes, string $content, $block ) : string {
    $post_id = $block->context['postId'];

If you do not declare that your block requires the post ID then $block->context['postId'] will have no value.

Answer 2

I recently had the same issue. The workaround I used was to save the current post id as an attribute of the block:

const currentPostId = useSelect( ( select ) => {
    return select( 'core/editor' ).getCurrentPostId();
}, [] );

useEffect( () => {
    if ( currentPostId && currentPostId !== postId ) {
        setAttributes( { postId: currentPostId } );
    }
}, [ currentPostId ] );