Categories


Archives


Recent Posts


Categories


Magento 2: uiElement Maps Default

astorm

Frustrated by Magento? Then you’ll love Commerce Bug, the must have debugging extension for anyone using Magento. Whether you’re just starting out or you’re a seasoned pro, Commerce Bug will save you and your team hours everyday. Grab a copy and start working with Magento instead of against it.

No Frills Magento Layout is the only Magento front end book you'll ever need. Get your copy today!

One Magento uiElement default you don’t need to worry about is the maps default, seen here in uiElement’s source file

#File: vendor/magento/module-ui/view/base/web/js/lib/core/element/element.js
defaults:{
    /* ... */
    maps: {
        imports: {},
        exports: {}
    },    
    /* ... */        
}    

This isn’t a magic default, it’s just the uiElement class setting up a skeleton data structure. Magento uses the .maps property of the instantiated object in the Magento_Ui/js/lib/core/element/links module. The functions in the links module are merged in as methods on your uiElement instantiated object. If you look at links.js, wherever you see owner.maps

#File: vendor/magento/module-ui/view/base/web/js/lib/core/element/links.js
if (data) {
    setData(owner.maps, property, data);
    transfer(owner, data, property, true);
}    

That .maps property is a property on your uiElement. Magento uses the information in maps to keep track of what’s been imported/exported into a uiElement based object. You can see this on the customer listing page with the following console javascript

object = requirejs('uiRegistry').get('customer_listing.customer_listing.listing_top.columns_controls');

console.log(object.maps.import);

For more information on the import/export defaults feature, see the Magento 2: uiClass Data Features article and the Magento Quickies post covering the links default.

Copyright © Alan Storm 1975 – 2017 All Rights Reserved

Originally Posted: 28th November 2016