# j-Stash

> The component can postpone elements without destructing and detaching from the DOM. This component can help you with dynamic content from the server side. We use the component in the Total.js FlowStre

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: en
Content-SHA256: b250a27f45b5d99ee5a818aecf8d0675939ce15f54c62f888b7cc45c51a8667b
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

The component can postpone elements without destructing and detaching from the DOM. This component can help you with dynamic content from the server side. We use the component in the Total.js FlowStream projects for the component's settings.

- elements can contain everything like components, scopes, binders, etc.

__Configuration__:

- `load {String}` a path to the method `function(id, next(html/element))` that is evaluated if the content wasn't loaded before
- __NEW__: `class {String}` a class name for the stash container (default: `hidden`)

__Methods__:

- `component.add(id, html/element)` adds new HTML/element
- `component.clear([id])` clears specific ID (`id` is optional) or clears all cached content

Use it with `<ui-component name="stash">`. When the component is not loaded yet, jComponent downloads it on first use from the address in `DEF.fallback` (the Componentator CDN by default). Author: Peter Širka. Source: the Componentator components repository, MIT license.

```html example.html
<ui-component name="stash" path="common.id" config="load:loadcontent"></ui-component>

<script>

	var common = {};

	function loadcontent(id, next) {
		// next(html/element)
		console.log('LOAD:', id);
		next('<div>{0}</div>'.format(id));
	}

	setTimeout(function() {
		SET('common.id', 'component_settings_1');
	}, 1000);

	setTimeout(function() {
		SET('common.id', 'component_settings_2');
	}, 3000);

	setTimeout(function() {
		SET('common.id', 'component_settings_3');
	}, 6000);

	setTimeout(function() {
		SET('common.id', 'component_settings_1');
	}, 9000);

</script>
```