Come usare la libreria jquery in Magento 2?


26

Sto creando un tema Magento in cui devo includere jQuery.

Quando aggiungo questo <link src="js/jquery-1.7.1.js"/>in head. Funziona ma le funzioni javascript di Magento non funzionano. Come usare la libreria jQuery integrata in Magento 2 su un tema personalizzato?


jquery è già stato aggiunto a m2. Se hai bisogno di jquery nel tuo file phtml personalizzato, utilizzalo da
— request.js

sì, lo so che voglio usare in tema personalizzato .. ho file che dipendono dalla libreria jquery.
— Qaisar Satti,

1
use request (['jquery', 'jquery / ui'], function ($) {}
— Shaheer Ali

puoi aggiungere js extrnal usando <script src = "[Vendor_Ext] :: js / custom.js" />
— Shaheer Ali

Da quando includi js per linktag ??? Devi usare il tag script
— Black

Risposte:


52

Se stai aggiungendo la tua libreria js personalizzata diversa da jQuery, devi includere il codice js all'interno che richiede una funzione come:

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

Esempi:

All'interno della funzione richiesta, è possibile accedere direttamente alla funzionalità jQuery in atto utilizzando uno jQueryo il suo alias in forma breve, il $simbolo del dollaro . Per esempio:

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

Ecco un esempio con l' $alias:

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

È possibile includere prototype.js?
— Slimshadddyyy

@Vikram, Sì, aggiungi semplicemente l'elemento 'prototype' all'array che passi per la funzione request ().
— Roman Glushko,

4

Jquery / JqueryUI sono stati aggiunti in magento2. Puoi vedere in lib / web / jquery

Per usare jquery o chiamare widget di magento. Dal tuo file 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>;

});

3
l'ho provato e non funziona puoi posizionare qualcosa in base al tema.
— Qaisar Satti,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.