Cara menulis ulang fungsi widget dengan mixins Magento 2.1.1

Kita punya swatch-renderer.js

Dalam file ini ada beberapa widget.

....
    $.widget('mage.SwatchRenderer', {
....

    /**
     * @private
     */
    _init: function () {
        if (this.options.jsonConfig !== '' && this.options.jsonSwatchConfig !== '') {
            this._sortAttributes();
            this._RenderControls();
        } else {
            console.log('SwatchRenderer: No input data received');
        }
    },

    /**
     * @private
     */
    _sortAttributes: function () {
        this.options.jsonConfig.attributes = _.sortBy(this.options.jsonConfig.attributes, function (attribute) {
            return attribute.position;
        });
    },

Saya ingin menulis ulang beberapa fungsinya.

Apa cara yang tepat bagaimana melakukannya?

Penjelasan di perpustakaan magento tidak aktual lagi, mereka terkait pada kelas yang menggunakan pendekatan lain (saya berbicara tentang place-order.js / place-order-mixin.js). Dan contoh yang dijelaskan tidak menjelaskan bagaimana cara menulis ulang fungsi widget.

— zhartaunik
sumber

Jawaban:

requireejs-config.js

var config = {
    config: {
        mixins: {
            'Magento_Swatches/js/swatch-renderer': {
                'path/to/your/mixin': true
            }
        }
    }
};

path / ke / your / mixin.js

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

    return function (widget) {

        $.widget('mage.SwatchRenderer', widget, {
            _Rebuild: function () {
                console.log('Hello from rebuild', arguments);
                return this._super();
            }
        });

        return $.mage.SwatchRenderer;
    }
});

— Maks
sumber

Sunting: jawaban saya tidak menggunakan mixin. Sepengetahuan saya, mixin hanya berfungsi untuk metode penulisan ulang dan properti. Dalam kasus Anda, ini adalah JS murni yang dipanggil langsung di luar metode.

Anda dapat melakukannya melalui modul.

Dalam Vendor/Module/view/frontend/requirejs-config.jsAnda dapat menambahkan berikut:

var config = {
    map: {
        '*': {
            'Magento_Swatches/js/swatch-renderer':'Vendor_Module/js/swatch-renderer'
        }
    }
};

Kemudian Anda dapat membuat Vendor/Module/view/frontend/web/js/swatch-renderer.jsfile dengan menyalin swatch-renderer.jsfile asli dan memodifikasi kontennya berdasarkan apa yang ingin Anda lakukan.

— Raphael di Digital Pianism
sumber

Raphael , maaf sudah lama tidak merespons. Tidak punya waktu luang. Dengan kata lain tidak ada cara yang tepat untuk menulis ulang metode widget? Hanya penulisan ulang lengkap yang lengkap? Maksud saya jika magento memperbarui file yang ada - kita perlu memperbarui penulisan ulang kita.

— zhartaunik

@zhartaunik sangat mungkin untuk menulis ulang metode widget menggunakan mixin. Masalah dalam kasus Anda adalah bahwa file ratcher ratcher tidak memiliki metode apa pun, ini adalah satu skrip tunggal. Karena itu kita tidak dapat menggunakan mixin dan karenanya harus menulis ulang penuh. AFAIK itulah satu-satunya cara untuk melakukannya

— Raphael di Digital Pianism

@RaphaelatDigitalPianism Saya baru saja mencoba melakukan hal yang sama seperti yang Anda gambarkan tetapi terus mendapatkan Uncaught TypeError: base is not a constructor- ada ide mengapa? Terima kasih

— Tom Burman

Anda harus dapat menulis ulang SwatchRendererwidget dengan mixin karena fungsi yang diteruskan definetelah ada di akhir return $.mage.SwatchRenderer;. Saya tidak tahu tentang widget lain yang ditentukan dalam file yang sama SwatchRendererTooltip.

— jelas