Ошибка jshint при передаче объекта wp_localize_script () в файл js

Question

Я пытаюсь нажать на кнопку и получить ответ.

Вот кнопка

$output .= '<div class="col-md-12">';
    $label = __( 'More Stories', 'everstrap' );
    $output .= "<button type='buttn' class='button_two load-more-btn'>{$label}</button>";
$output .= '</div>';

Как я передаю ajaxob Объект:

$script_data_array = array(
    'ajaxurl' => admin_url( 'admin-ajax.php' ),
    'security' => wp_create_nonce( 'load_more_posts' ),
);
wp_localize_script( 'everstrap-scripts', 'ajaxobj', $script_data_array );

Теперь код файла JS ниже:

window.EStrap = (function (window, document, $, undefined) {
    'use strict';

    var app = {
        init: function () {
            console.log('Working');
            $(window).on('scroll', app.handleSticky);
            $('.hamburger-btn').on('click', app.toggleNavDrawer);
            $('.nav-drawer-close').on('click', app.closeNavDrawer);
            $('.load-more-btn').on('click', app.loadMoreStories);
        },
        loadMoreStories:function(){
            var page = 2;
            var data = {
                'action': 'load_posts_by_ajax',
                'page': page,
                'security': ajaxobj.security
            };   
            $.post(ajaxobj.ajaxurl, data, function(response) {
                if($.trim(response) !== '') {
                    $('.load-more-stories').append(response);
                    page++;
                } else {
                    $('.load-more-btn').hide();
                }
            });
        },
        handleSticky:function () {
            if ($(window).scrollTop() > 600) {
                $('#main-nav').addClass('sticky-header');
            } else if ($(window).scrollTop() < 300) {
                $('#main-nav').removeClass('sticky-header');
            }
        },
        toggleNavDrawer:function () {
            var $nav_drawer = $('#nav-drawer');
            $nav_drawer.toggleClass('open');
        },
        closeNavDrawer:function () {
            var $nav_drawer = $('#nav-drawer');
            $nav_drawer.removeClass('open');
        }
    };

    $(document).ready(app.init);
    return app;
})(window, document, jQuery);

Теперь, когда я сохраняю изменения, я увидел следующую ошибку из jshint

assets / js / scripts . js 17 | 'security': ajaxobj.security ^ 'ajaxobj' не определен. 19 | $ .post (ajaxobj.ajaxurl, data, function (response) {^ 'ajaxobj' не определен.

Почему ajaxobj здесь не доступен и как его решить?

Answer 1

Пожалуйста, проверьте wp_enqueue_script ('everstrap-scripts') правильно и перед локализацией. Я проверил это работает нормально. Пожалуйста, проверьте, что ваш код должен выглядеть следующим образом.

wp_enqueue_script( 'everstrap-scripts', get_template_directory_uri() . 
'/assets/js/everstrap_scripts.js' );
        //}

        $script_data_array = array(
            'ajaxurl' => admin_url( 'admin-ajax.php' ),
            'security' => wp_create_nonce( 'load_more_posts' ),
        );

wp_localize_script( 'storefront-homepage', 'ajaxobj', $script_data_array );

После этого добавьте, проверьте его в js коде с помощью console.log. Как ниже

window.EStrap = (function (window, document, $, undefined) {
'use strict';

console.log('ajaxobj.security' + ajaxobj.security);
})(window, document, jQuery);