Each component is an instance of Emitter module.
npm install spa-componentAdd the singleton to the scope:
var Component = require('spa-component');Create instance with custom config:
var component = new Component({
$node: document.getElementById(id),
className: 'bootstrap responsive',
events: {
click: function () {
// some you`r actions
}
}
});
component.add(
new Button(), // The instance of Component
new Button() // [Button class](https://github.com/spasdk/component-button)
);
component.focus();| Name | Type | Default value | Description |
|---|---|---|---|
| id | Element | cid(0-n) | component unique identifier (generated if not set) |
| className | String | name | space-separated list of classes for "className" property of this.$node |
| $node | Element | null | DOM element/fragment to be a component outer container |
| $body | Element | null | DOM element/fragment to be a component inner container (by default is the same as $node) |
| parent | Component | null | link to the parent component which has this component as a child |
| children | Array. | [] | list of components in this component |
| events | Object.<string, function> | {} | list of event callbacks |
| visible | Boolean | true | component initial visibility state flag |
| focusable | Boolean | true | component can accept focus or not |
| propagate | Boolean | false | allow to emit events to the parent component |
There is a global var
DEVELOPwhich activates additional consistency checks and protection logic not available in release mode.
If you have any problem or suggestion please open an issue here. Pull requests are welcomed with respect to the JavaScript Code Style.
spa-component is released under the MIT License.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent