Як переписати функцію віджетів за допомогою міксингу Magento 2.1.1


17

Ми маємо swatch-renderer.js

У цьому файлі є кілька віджетів.

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

Я хотів би переписати деякі його функції.

Як правильно це зробити?

Пояснення в бібліотеці magento вже не є актуальними, вони пов'язані на класи, які використовують інший підхід (я кажу про place-order.js / place-order-mixin.js). І описані приклади не пояснюють як-небудь переписати функції віджетів.

Відповіді:


38

Requjs-config.js

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

шлях / до / вашого / 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;
    }
});

3

Редагувати: у моїй відповіді не використовується міксин. Наскільки мені відомо, суміші працюють лише для методів переписування та властивостей. У вашому випадку виклик чистого JS безпосередньо поза методом.

Ви можете зробити це через модуль.

У Vendor/Module/view/frontend/requirejs-config.jsви можете додати наступне:

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

Потім ви можете створити Vendor/Module/view/frontend/web/js/swatch-renderer.jsфайл, скопіювавши оригінальний swatch-renderer.jsфайл та змінивши його вміст, виходячи з того, що ви хочете зробити.


Рафаель , вибачте, що довго не реагував. Не мав вільного часу. Іншими словами, немає правильного способу переписати віджетні методи? Тільки повне повне перезапис? Я маю на увазі, що якщо magento оновить існуючий файл - нам потрібно буде оновити перезапис.
жартаунік

@zhartaunik цілком можливо переписати віджетні методи за допомогою міксинів. Проблема у вашому випадку полягає в тому, що файл swatch-renderer не має жодних методів, це один єдиний сценарій. Через це ми не можемо використовувати mixins, і тому нам доведеться повністю переписати. AFAIK - це єдиний спосіб зробити це
Рафаель у Digital Pianism

@RaphaelatDigitalPianism Я просто намагався зробити те саме, що ви описуєте, але постійно отримую Uncaught TypeError: base is not a constructor- будь-які ідеї, чому? Спасибі
Том Бурман

Ви повинні мати можливість переписати SwatchRendererвіджет на mixin, оскільки функція, передана, defineмає в кінці return $.mage.SwatchRenderer;. Я не знаю про інший віджет, визначений у тому самому файлі SwatchRendererTooltip.
незрозумілий
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.