Wordpress Gutenberg ACF 블록 블록이 열렸을 때 JS를 추가하는 방법

Wordpress Gutenberg ACF 블록 블록이 열렸을 때 JS를 추가하는 방법

저는 ACF Blocks를 사용하고 있으며 다음과 같은 Block을 가지고 있습니다.

acf_register_block_type(array(
    'name'              => 'columns',
    'title'             => __('Columns'),
    'description'       => __('For complex multi colomn rows.'),
    // 'category'          => 'formatting',
    'render_template'   => get_template_directory() . '/includes/blocks/templates/columns.php',
    'enqueue_style'     => get_template_directory_uri() . '/includes/blocks/css/columns.css',
    'enqueue_script'    => get_template_directory_uri() . '/includes/blocks/js/columns.js',
    'keywords' => array('rows', 'content', 'column'),
    'supports' => array('align' => array('wide', 'full')),
    'mode' => 'auto',
));

편집기에서 블록을 클릭하면 편집을 위해 JS를 실행해야 합니다.표준적인 방법이 있는지 몰라서 클릭 이벤트로 기능을 실행하면 된다고 생각했는데 작동이 안 돼요.여기 DOM에 있는 블록의 사진이 있습니다.

HTML 차단

여기 문서에 따라 스크립트를 추가했습니다. (아래쪽에는 "블록 스크립트 추가" 예시가 있습니다.)

여기 내가 다듬은 JS...

(function($){
    var initializeBlock = function ($block) {

        $('body').on('click', 'div[data-type="acf/columns"]', function () {
            console.log('teeeeeeeest');
        });

        //... Other JS put here works
    }

    if (window.acf) {
        window.acf.addAction('render_block_preview/type=columns', initializeBlock);
    }

})(jQuery);

왜 이 클릭 기능이 작동하지 않습니까?다른 방법이 있습니까?

언급URL : https://stackoverflow.com/questions/56432171/wordpress-gutenberg-acf-blocks-how-to-add-js-when-block-is-opened