Wie man die Widget-Funktion mit Mixins neu schreibt Magento 2.1.1

Wir haben swatch-renderer.js

In dieser Datei gibt es einige Widgets.

....
    $.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;
        });
    },

Ich möchte einige seiner Funktionen neu schreiben.

Was ist der richtige Weg, wie es geht?

Erklärungen in der Magento-Bibliothek sind nicht mehr aktuell, sie sind mit Klassen verknüpft, die einen anderen Ansatz verwenden (ich spreche von place-order.js / place-order-mixin.js). Und die beschriebenen Beispiele erklären nicht, wie Widget-Funktionen neu geschrieben werden.

requirejs-config.js

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

Pfad / zu / Ihrer / 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;
    }
});

Bearbeiten: Meine Antwort verwendet keine Mixins. Meines Wissens funktionieren Mixins nur für Methodenumschreibungen und Eigenschaften. In Ihrem Fall wird JS direkt außerhalb einer Methode aufgerufen.

Sie können dies über ein Modul tun.

In Vendor/Module/view/frontend/requirejs-config.jskönnen Sie Folgendes hinzufügen:

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

Anschließend können Sie die Vendor/Module/view/frontend/web/js/swatch-renderer.jsDatei erstellen , indem Sie die Originaldatei kopieren swatch-renderer.jsund den Inhalt entsprechend Ihren Vorstellungen ändern.