Magento2 - jQuery विजेट (configurable.js) का विस्तार कैसे करें


18

मैं एक एक्‍सटेंशन बना रहा हूं जो डिफाल्‍ट कॉन्‍फ़िगरेबल ऑप्‍शन लेबल की जगह लेता है, विशेषता नाम के साथ 'एक विकल्प चुनें ...', उदाहरण के लिए 'एक रंग चुनें'।

मैं jQuery विजेट configurable.js को कैसे बढ़ा सकता हूं (ओवरराइड नहीं कर सकता हूं) और केवल इस लाइन को संशोधित कर सकता हूं!

मैं प्रलेखन से जानता हूं कि मैं एक jQuery विजेट को ओवरराइड कर सकता हूं, इसलिए मैंने किया:

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

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

    });

    return $.silvan.configurable;
});

मैं इस फ़ाइल को कैसे आरंभ कर सकता हूं? क्या मुझे इसे आवश्यकता-विन्यास के माध्यम से लोड करना चाहिए? नक्शा कार्य केवल सही ओवरराइडिंग के लिए है?

क्या केवल इस पंक्ति को संशोधित करना संभव है? यह इस समारोह से कहा जाता है:

_fillSelect: function (element) {}

जवाबों:


29

सबसे पहले, आपको यह सुनिश्चित करने की आवश्यकता है, कि आपके मॉड्यूल Magento_ConfigurableProductमें अनुक्रम में है 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>

घटक सूची को फिर से बनाना सुनिश्चित करें config.php, अन्यथा अनुक्रम को नजरअंदाज कर दिया जाएगा ( http://devdocs.magento.com/guides/v2.2/extension-dev-guide/build/module-load-order.html )

फिर कोड के साथ निर्देशिका requirejs-config.jsमें फ़ाइल जोड़ें view/frontend:

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

अंत में configurable.jsफ़ाइल जोड़ें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;
});

आप एकल पंक्ति को संशोधित नहीं कर सकते, लेकिन आप एकल फ़ंक्शन को अंदर संशोधित कर सकते हैं।


एक फ़ंक्शन कैसे काम करता है? जनक को कैसे पुकारें?
एलेक्स

आप अपने द्वारा संशोधित किए गए कार्यों को केवल उसी तरह से कॉल कर सकते हैं जैसे यह आपके विजेट का हिस्सा था। अपने silvan.configurableआप माता-पिता से सभी विरासत में मिल जाते हैं।
बार्टोलोमिएज सुजुर्ट

2
यह बहुत अच्छा काम करता है, धन्यवाद @Ideo! बाउंटी 7 घंटे (स्टैकएक्सचेंज की सीमा) में दी जाएगी। @ आप इस का उपयोग करके माता-पिता को कॉल कर सकते हैं ।_सुपर (); समारोह। देखें: learn.jquery.com/jquery-ui/widget-factory/extending-widgets/…
सिल्वन

क्या कुछ और है? कारण मेरी कस्टम फ़ाइल अभ्यस्त हो जाना ... क्या यह ठीक है जैसा कि ऊपर वर्णित है :-(
roman204

1
यह महान काम करता है! @ roman204 मुझे एक ही मुद्दा मिला: सुनिश्चित करें कि आपके मॉड्यूल में "अनुक्रम" नोड है। xml फ़ाइल। फिर मॉड्यूल ऑर्डर को फिर से लोड करना महत्वपूर्ण है। फिलहाल इसे करने का एकमात्र तरीका मॉड्यूल को अक्षम करना और फिर से सक्षम करना है जहां आप मॉड्यूल "xml" फ़ाइल में "अनुक्रम" डालते हैं। (अधिक जानकारी: इस पृष्ठ पर नीला भाग देखें: devdocs.magento.com/guides/v2.2/extension-dev-guide/build/… )
Stijn Duynslaeger - 1
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.