Call multiple times require JS in a single file, is it the right move

Viewed 8

I need to use require js to use jquery in my block(Magento2). Do I have to declare for each function require JS at each beginning or there is a way to declare it only once?

here is my code, thanks

my html

<div class="mainMenu">
    <div style="background-color: black;color: white;">
        <div onClick="openCategory(1)">MENU 1</div>
        <div onClick="openCategory(2)">MENU 2</div>
        <div onClick="openCategory(3)">MENU 3</div>
    </div>
</div>
<div onClick="openMainMenu()">
    OUVRIR MENU
</div>

SCRIPT inside phtml

<script>
    let menu
    require(['jquery', 'jquery/ui'], function($){
        
        $.ajax({
            url: "https://catfact.ninja/fact",
            context: document.body
        }).done(function(value) {
            menu = []
            menu.forEach(element => {
                $('.mainMenu').append("<div class='menuContainer menuNumber" + element.id + "'>" + element.name + "</div>")
            });
        });


    });
    function openMainMenu(){
        require(['jquery', 'jquery/ui'], function($){
            $('.mainMenu').show()
        });
    }
    function openCategory(categoryNumber){
        require(['jquery', 'jquery/ui'], function($){
            console.log($('.menuNumber' + categoryNumber).css("visibility", "visible"));
        });
    }
</script>
0 Answers
Related