Как использовать библиотеку jquery в Magento 2?

26

Я создаю тему Magento, где мне нужно включить jQuery.

Когда я добавлю это <link src="js/jquery-1.7.1.js"/>в head. Это работает, но функции Magento javascript не работают. Как использовать встроенную в jQuery библиотеку Magento 2 для пользовательской темы?

Кайсар Сатти
источник
JQuery уже добавлен в м2. Если вам нужен jquery в вашем настраиваемом phtml-файле, используйте его по адресу require.js
Shaheer Ali
да, я знаю, что я хочу использовать в пользовательской теме .. у меня есть файл, который зависит от библиотеки jquery.
Кайсар Сатти
1
используйте require (['jquery', 'jquery / ui'], function ($) {}
Шахир Али
Вы можете добавить внешние js, используя <script src = "[Vendor_Ext] :: js / custom.js" />
Shaheer Ali
С каких это пор вы включаете js по linkтегу ??? Вы должны использовать скрипт тега
Black

Ответы:

52

Если вы добавляете свою собственную библиотеку js, отличную от jQuery, вам нужно включить код js в функцию require, например:

 require(['jquery', 'jquery/ui'], function($){ 
     //your js code here  
 });

Примеры:

Внутри функции require вы можете напрямую получить доступ к функциональности jQuery на месте, используя любой из jQueryсокращенных псевдонимов или $знак доллара . Например:

require(['jquery', 'jquery/ui'], function($){
  jQuery(document).ready( function() {
    alert("Page loaded.");
  });
});

Вот пример с $псевдонимом:

require(['jquery', 'jquery/ui'], function($){
  $(document).ready( function() {
    alert("Page loaded.");
  });
});
Шахир Али
источник
Можно ли включить prototype.js?
Slimshadddyyy
@Vikram, да, просто добавьте элемент «prototype» в массив, который вы передаете функции require ().
Роман Глушко
4

Jquery / JqueryU я добавил в magento2. Вы можете увидеть в lib / web / jquery

Использовать jquery или вызывать виджет magento. Из вашего файла JS

define([
  'jquery',
  'jquery/ui',
  'mage/<widget.name>' found in /lib/web/mage dir
], function($){

$.widget('<your_namespace>.<your_widget_name>', $.mage.<widget.name>, {  CODE HERE... });

return $.<your_namespace>.<your_widget_name>;

});
mrtuvn
источник
3
Я попробовал это, и это не работает. Можете ли вы разместить что-то по теме.
Кайсар Сатти