gutenberg-action-filter-hooks

const { __ } = wp.i18n; // Import __() from wp.i18n
const { registerBlockType } = wp.blocks; // Import registerBlockType() from wp.blocks

/**
 * Register: aa Gutenberg Block.
 */
registerBlockType( 'my-plugin/my-custom-block', {
	title: __( 'Hook Example' ), // Block title.
	icon: 'shield', // Block icon from Dashicons → https://developer.wordpress.org/resource/dashicons/.
	category: 'common', // Block category — Group blocks together based on common traits E.g. common, formatting, layout widgets, embed.
	keywords: [
		__( 'action' ),
		__( 'filter' ),
		__( 'hook' ),
	],

	/**
	 * The edit function describes the structure of your block in the context of the editor.
	 * This represents what the editor will render when the block is used.
	 *
	 * The "edit" property must be a valid function.
	 *
	 * @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
	 */
	edit: function( props ) {

        let output = 'Initial Output';
        output = wp.hooks.applyFilters( 'prefix_filter_output', output  );
        return (
            <div>
                Output is here:
                { wp.hooks.doAction( 'prefix_action_before_output',output ) /*does not display anything*/}
                { output }
            </div>
        );
	},

	/**
	 * The save function
	 *
	 * @link https://wordpress.org/gutenberg/handbook/block-api/block-edit-save/
	 */
	save: function( props ) {
		return (
			<div>
                Save it later
            </div>
		);
	},
} );


/*Here is Hooks*/
function prefix_action_callback(output){
    return output; //does not display anything
}
function prefix_filter_callback(output){
    return output+' and Filter Callback Output';
}

wp.hooks.addAction( 'prefix_action_before_output', 'my-plugin/my-custom-block', prefix_action_callback );
wp.hooks.addFilter( 'prefix_filter_output', 'my-plugin/my-custom-block', prefix_filter_callback );