Magento2 - jQuery widget'ı nasıl genişletilir (configurable.js)


18

Varsayılan yapılandırılabilir seçenekler etiketini 'Bir Seçenek Seçin ...' ile öznitelik adıyla, örneğin 'Bir Renk Seçin ...' ile değiştiren bir uzantı oluşturuyorum.

JQuery widget'ı configurable.js'yi nasıl genişletebilirim (geçersiz kılamaz!) Ve yalnızca bu satırı değiştirebilirim?

Belgeleri bir jQuery widget geçersiz kılabilir biliyorum, bu yüzden yaptım:

define([
    'jquery',
    'jquery/ui',
    'configurable' // usually widget can be found in /lib/web/mage dir
], function($){

    $.widget('silvan.configurable', $.mage.configurable, {

    });

    return $.silvan.configurable;
});

Bu dosyayı nasıl başlatabilirim? Requirjs-config ile yüklemeli miyim? Harita fonksiyonu sadece geçersiz kılmak içindir?

Yalnızca bu satırı değiştirmek mümkün müdür? Bu işlevden çağrılır:

_fillSelect: function (element) {}

Yanıtlar:


29

Öncelikle, modülünüzün Magento_ConfigurableProductsırasıyla module.xml:

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Vendor_ModuleName" setup_version="1.0.0">
        <sequence>
            <module name="Magento_ConfigurableProduct"/>
        </sequence>
    </module>
</config>

Bileşen listesini yeniden oluşturduğunuzdan emin olun config.php, aksi takdirde dizi yok sayılır ( http://devdocs.magento.com/guides/v2.2/extension-dev-guide/build/module-load-order.html )

Ardından eklemek requirejs-config.jsdosyayı view/frontendkoduyla dizinde:

var config = {
    map: {
        '*': {
            configurable: 'Vendor_ModuleName/js/configurable'
        }
    }
};

Son olarak şu dizine configurable.jsdosya ekleyin view/frontend/web/js:

define([
    'jquery',
    'jquery/ui',
    'Magento_ConfigurableProduct/js/configurable'
], function($){

    $.widget('silvan.configurable', $.mage.configurable, {
        //code you want to override
    });

    return $.silvan.configurable;
});

Tek bir satırı değiştiremezsiniz, ancak içindeki tek bir işlevi değiştirebilirsiniz.


Bir işlevi değiştirmek nasıl çalışır? Ebeveyn nasıl aranır?
Alex

Widget'ınızın bir parçasıymış gibi, değiştirdiğiniz işlev dışındaki işlevleri çağırabilirsiniz. Sizin silvan.configurableotomatik ebeveynden tüm devralır.
Bartłomiej Szubert

2
Bu harika çalışıyor, teşekkürler @Ideo! Ödül 7 saat içinde verilir (yığın değişim sınırı). @Alex, this._super () öğesini kullanarak ebeveyni arayabilirsiniz; işlevi. Bakınız: learn.jquery.com/jquery-ui/widget-factory/extending-widgets/…
Silvan

yapılacak başka bir şey var mı? benim özel dosya yüklenmeyecek neden ... yukarıda açıklandığı gibi kesin mi :-(
roman204

1
Harika çalışıyor! @ roman204 Aynı sorunu aldım: module.xml dosyanızda "dizi" düğümü bulunduğundan emin olun. Ardından modül sırasını yeniden yüklemek önemlidir. Şu anda bunu yapmanın tek yolu, module.xml dosyasına "sırayı" koyduğunuz modülü devre dışı bırakmak ve yeniden etkinleştirmektir. (Daha fazla bilgi: bu sayfadaki mavi kısmı görüntüleyin: devdocs.magento.com/guides/v2.2/extension-dev-guide/build/… )
Stijn Duynslaeger - Echron
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.