@alexgyver/component 1.0.24 → 1.0.25
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/component.js +17 -14
- package/package.json +1 -1
package/component.js
CHANGED
|
@@ -24,6 +24,7 @@ export class Component {
|
|
|
24
24
|
parent - {Element} добавляет компонент к указанному элементу (имеет смысл только для корневого компонента)
|
|
25
25
|
style {string | object} объект в виде { padding: '0px', ... } или строка css стилей
|
|
26
26
|
children - массив DOM, Component, object, html string
|
|
27
|
+
child - DOM, Component, object, html string
|
|
27
28
|
всё остальное будет добавлено как property
|
|
28
29
|
*/
|
|
29
30
|
/**
|
|
@@ -47,6 +48,20 @@ export class Component {
|
|
|
47
48
|
static config(el, data) {
|
|
48
49
|
if (!(el instanceof Node)) return el;
|
|
49
50
|
const context = data.context;
|
|
51
|
+
|
|
52
|
+
let addChild = (obj) => {
|
|
53
|
+
if (!obj) return;
|
|
54
|
+
if (obj instanceof Node) el.appendChild(obj);
|
|
55
|
+
else if (obj instanceof Component) el.appendChild(obj.$root);
|
|
56
|
+
else if (typeof obj === 'object') {
|
|
57
|
+
if (!obj.context) obj.context = context;
|
|
58
|
+
let cmp = Component.make(obj.tag, obj);
|
|
59
|
+
if (cmp) el.appendChild(cmp);
|
|
60
|
+
} else if (typeof obj === 'string') {
|
|
61
|
+
el.innerHTML += obj;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
|
|
50
65
|
for (const [key, val] of Object.entries(data)) {
|
|
51
66
|
switch (key) {
|
|
52
67
|
case 'tag':
|
|
@@ -62,24 +77,12 @@ export class Component {
|
|
|
62
77
|
case 'parent': if (val instanceof Element) val.append(el); break;
|
|
63
78
|
case 'attrs': for (let attr in val) el.setAttribute(attr, val[attr]); break;
|
|
64
79
|
case 'props': for (let prop in val) el[prop] = val[prop]; break;
|
|
80
|
+
case 'child': addChild(val); break;
|
|
81
|
+
case 'children': for (const obj of val) addChild(obj); break;
|
|
65
82
|
case 'style':
|
|
66
83
|
if (typeof val === 'string') el.style.cssText += (val + ';');
|
|
67
84
|
else for (let st in val) el.style[st] = val[st];
|
|
68
85
|
break;
|
|
69
|
-
case 'children':
|
|
70
|
-
for (const obj of val) {
|
|
71
|
-
if (!obj) continue;
|
|
72
|
-
if (obj instanceof Node) el.appendChild(obj);
|
|
73
|
-
else if (obj instanceof Component) el.appendChild(obj.$root);
|
|
74
|
-
else if (typeof obj === 'object') {
|
|
75
|
-
if (!obj.context) obj.context = context;
|
|
76
|
-
let cmp = Component.make(obj.tag, obj);
|
|
77
|
-
if (cmp) el.appendChild(cmp);
|
|
78
|
-
} else if (typeof obj === 'string') {
|
|
79
|
-
el.innerHTML += obj;
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
break;
|
|
83
86
|
default: el[key] = val; break;
|
|
84
87
|
}
|
|
85
88
|
}
|