Membuat widget js di magento 2

Dengan menggunakan widget js, kita bisa memanggil fungsi widget kita di file template maupun block.

Kita bisa menambahkan javascript di template maupun plugin kita sesuai kebutuhan. Jika anda ingin menambahkan di themes bisa anda masukkan ke <Direktori theme>/web/js/<file js>. Sementara jika ingin menambahkan di plugin <Direktori theme>/view/frontend/web/js/<file js> (jika ingin untuk plugin admin ganti frontend dengan adminhtml.)

Dengan menggunakan widget js model ini, kita bisa mengkomunikasikan antara block html dan widget js kita. Kita bisa mengirim argumen dari block html dan dibaca oleh js

define(['jquery'], function($){
    'use strict';

    return function(config, element){
      //codingan kita disini
      // variable element bisa untuk mengakses elemen yang memanggil widget ini
      // config berisi data untuk kita olah, data ini dikirim dari html
    }
  }
)

Pemanggilan di block

untuk pemanggilannya di block html, dapat kita deklarasikan seperti berikut:

<div data-mage-init='{"Vendor_Module/js/widget_saya":{"foo":"bar"}}'>
</div>

Vendor_Module/js/widget_saya merupakan widget js yang telah kita buat, kita juga bisa mengoper data berupa {foo:’bar’} ke widget yang telah kita buat tadi.

Leave a Reply