I've loaded a jQuery script with enqueue_block_editor_assets
for gutenberg and wp_print_scripts
for frontend which is loaded fine.
add_action( 'wp_print_scripts', 'sk_load_script' );
add_action( 'enqueue_block_editor_assets', 'sk_load_script' );
add_action( 'enqueue_block_editor_assets', 'sk_gutenberg_script' );
The sk_load_script
function loads both the frontend.js
for both frontend and gutenberg whereas sk_gutenberg_script
function loads block.js
However when I do in frontend.js
:
jQuery(document).ready(function ($) {
var place = jQuery('.sk-place');
console.log(place);
}
That does not print anything on the console in the Gutenberg area. But it prints in the frontend.
In the block.js
edit function, I have the custom event.
constructor() {
const event = new Event( 'skLoad' );
document.dispatchEvent( event );
}
With that, when I do in frontend.js,
document.addEventListener( 'skLoad', function( e ) {
var place = jQuery('.sk-place');
console.log(place);
}, false );
This runs fine as well, but only while adding the block.
How do I run that when the already preset block is in place on loading Gutenberg area, or when loading the block (not on edit only)?
Actually, I also need that on change of other inputs in the Gutenberg block settings, I mean in the edit()
in block.js such as on change of this: https://ibb.co/SXkbhc6
Thanks!
sk_load_script
andsk_gutenberg_script
in here.edit()
component?