When an element includes multiple modules (e.g., data-include="moduleA, moduleB"), you can pass data between them using the lazyunload and lazyload lifecycle methods within your module definitions.
- In
lazyunload: Use the data object to set data.shareState. This object is made available to other modules being loaded/unloaded. - In
lazyload: Access data.shareState to retrieve the values passed from other modules.
This allows modules to synchronize UI states, such as form input values, during the transition.
define(function(){
var Nav = function(element, options) {};
Nav.prototype = {};
// Called when the module is being unloaded/replaced
Nav.prototype.lazyunload = function(data){
data.resetHTML = true;
// Share state with other modules
data.shareState = {
searchValue: $('input.search', data.target).val()
};
};
// Called when the module is loaded
Nav.prototype.lazyload = function(data){
// Check if shared state exists from another module
if(data.shareState){
$('input.search', data.target).val(data.shareState.searchValue || '');
}
};
return Nav;
});
