diff --git a/packages/fineui/src/core/wrapper/layout.js b/packages/fineui/src/core/wrapper/layout.js index 288d586eb..adaf5d351 100644 --- a/packages/fineui/src/core/wrapper/layout.js +++ b/packages/fineui/src/core/wrapper/layout.js @@ -1,4 +1,17 @@ -import { isNull, isFunction, each, stripEL, keys, isArray, contains, isKey, isOdd, isWidget, isNotNull, has } from "../2.base"; +import { + isNull, + isFunction, + each, + stripEL, + keys, + isArray, + contains, + isKey, + isOdd, + isWidget, + isNotNull, + has +} from "../2.base"; import { Widget } from "../4.widget"; import { _lazyCreateWidget, Providers } from "../5.inject"; import { shortcut } from "../decorator"; @@ -65,38 +78,38 @@ export class Layout extends Widget { _init4Scroll() { switch (this.options.scrollable) { - case true: - case "xy": - this.element.css("overflow", "auto"); - - return; - case false: - this.element.css("overflow", "hidden"); - - return; - case "x": - this.element.css({ - "overflow-x": "auto", - "overflow-y": "hidden", - }); - - return; - case "y": - this.element.css({ - "overflow-x": "hidden", - "overflow-y": "auto", - }); - - return; - default : - break; + case true: + case "xy": + this.element.css("overflow", "auto"); + + return; + case false: + this.element.css("overflow", "hidden"); + + return; + case "x": + this.element.css({ + "overflow-x": "auto", + "overflow-y": "hidden", + }); + + return; + case "y": + this.element.css({ + "overflow-x": "hidden", + "overflow-y": "auto", + }); + + return; + default : + break; } if (this.options.scrollx) { this.element.css({ "overflow-x": "auto", "overflow-y": "hidden", }); - + return; } if (this.options.scrolly) { @@ -149,7 +162,7 @@ export class Layout extends Widget { } else { w = this.getWidgetByName(this._getChildName(i)); } - + return w; } @@ -163,7 +176,7 @@ export class Layout extends Widget { } }); }); - + return this._addElement(i, item, context, w); } @@ -175,7 +188,7 @@ export class Layout extends Widget { if (item instanceof Widget) { item = item.options; } - + return item; } @@ -190,19 +203,19 @@ export class Layout extends Widget { } const className = Object.prototype.toString.call(a); switch (className) { - case "[object RegExp]": - case "[object String]": - return `${a}` === `${b}`; - case "[object Number]": - if (+a !== +a) { - return +b !== +b; - } - - return +a === 0 ? 1 / +a === 1 / b : +a === +b; - case "[object Date]": - case "[object Boolean]": - return +a === +b; - default: + case "[object RegExp]": + case "[object String]": + return `${a}` === `${b}`; + case "[object Number]": + if (+a !== +a) { + return +b !== +b; + } + + return +a === 0 ? 1 / +a === 1 / b : +a === +b; + case "[object Date]": + case "[object Boolean]": + return +a === +b; + default: } const areArrays = className === "[object Array]"; @@ -252,10 +265,10 @@ export class Layout extends Widget { } aStack.pop(); bStack.pop(); - + return true; }; - + return eq(item1, item2); } @@ -264,9 +277,9 @@ export class Layout extends Widget { } // 不依赖于this.options.items进行更新 - _updateItemAt(oldIndex, newIndex, item) { + _updateItemAt(oldIndex, newIndex, item, context) { const del = this._children[this._getChildName(oldIndex)]; - const w = this._newElement(newIndex, item); + const w = this._newElement(newIndex, item, context); // 需要有个地方临时存一下新建的组件，否则如果直接使用newIndex的话，newIndex位置的元素可能会被用到 this._children[`${this._getChildName(newIndex)}-temp`] = w; const nextSibling = del.element.next(); @@ -277,7 +290,7 @@ export class Layout extends Widget { } del._destroy(); w._mount(); - + return true; } @@ -314,42 +327,47 @@ export class Layout extends Widget { if (Providers.getProvider(SystemProvider.xtype).getLayoutOptimize()) { return ((!item.type && item.el) ? ((item._lgap || 0) + (item.lgap || 0)) : item._lgap) || 0; } - + return (item._lgap || 0) + (item.lgap || 0); } + _optimiseItemRgap(item) { if (Providers.getProvider(SystemProvider.xtype).getLayoutOptimize()) { return ((!item.type && item.el) ? ((item._rgap || 0) + (item.rgap || 0)) : item._rgap) || 0; } - + return (item._rgap || 0) + (item.rgap || 0); } + _optimiseItemTgap(item) { if (Providers.getProvider(SystemProvider.xtype).getLayoutOptimize()) { return ((!item.type && item.el) ? ((item._tgap || 0) + (item.tgap || 0)) : item._tgap) || 0; } - + return (item._tgap || 0) + (item.tgap || 0); } + _optimiseItemBgap(item) { if (Providers.getProvider(SystemProvider.xtype).getLayoutOptimize()) { return ((!item.type && item.el) ? ((item._bgap || 0) + (item.bgap || 0)) : item._bgap) || 0; } - + return (item._bgap || 0) + (item.bgap || 0); } + _optimiseItemHgap(item) { if (Providers.getProvider(SystemProvider.xtype).getLayoutOptimize()) { return ((!item.type && item.el) ? ((item._hgap || 0) + (item.hgap || 0)) : item._hgap) || 0; } - + return (item._hgap || 0) + (item.hgap || 0); } + _optimiseItemVgap(item) { if (Providers.getProvider(SystemProvider.xtype).getLayoutOptimize()) { return ((!item.type && item.el) ? ((item._vgap || 0) + (item.vgap || 0)) : item._vgap) || 0; } - + return (item._vgap || 0) + (item.vgap || 0); } @@ -450,7 +468,7 @@ export class Layout extends Widget { w.element.prependTo(this._getWrapper()); } w._mount(); - + return w; } @@ -479,7 +497,7 @@ export class Layout extends Widget { if (!child || !child.shouldUpdate) { return null; } - + return child.shouldUpdate(this._getOptions(item)); } @@ -532,7 +550,7 @@ export class Layout extends Widget { value = value.concat(v); } }); - + return value; } @@ -552,19 +570,19 @@ export class Layout extends Widget { }); } - patchItem(oldVnode, vnode, oldIndex, newIndex) { + patchItem(oldVnode, vnode, oldIndex, newIndex, context) { const shouldUpdate = this.shouldUpdateItem(oldIndex, vnode); const child = this._children[this._getChildName(oldIndex)]; if (shouldUpdate) { this._children[`${this._getChildName(newIndex)}-temp`] = child; - + return child._update(this._getOptions(vnode), shouldUpdate); } if (shouldUpdate === null && !this._compare(oldVnode, vnode)) { // if (child.update) { // return child.update(this._getOptions(vnode)); // } - return this._updateItemAt(oldIndex, newIndex, vnode); + return this._updateItemAt(oldIndex, newIndex, vnode, context); } } @@ -647,7 +665,7 @@ export class Layout extends Widget { findIndex = i; } } - + return [found, findIndex]; }; @@ -665,26 +683,26 @@ export class Layout extends Widget { } else if (isNull(oldEndVnode)) { oldEndVnode = oldCh[--oldEndIdx]; } else if (sameVnode(oldStartVnode, newStartVnode, oldStartIdx, newStartIdx)) { - const willUpdate = this.patchItem(oldStartVnode, newStartVnode, oldStartIdx, newStartIdx); + const willUpdate = this.patchItem(oldStartVnode, newStartVnode, oldStartIdx, newStartIdx, context); updated = willUpdate || updated; children[isNull(oldStartVnode.key) ? oldStartIdx : oldStartVnode.key] = willUpdate ? this._children[`${this._getChildName(newStartIdx)}-temp`] : this._children[this._getChildName(oldStartIdx)]; oldStartVnode = oldCh[++oldStartIdx]; newStartVnode = newCh[++newStartIdx]; } else if (sameVnode(oldEndVnode, newEndVnode, oldEndIdx, newEndIdx)) { - const willUpdate = this.patchItem(oldEndVnode, newEndVnode, oldEndIdx, newEndIdx); + const willUpdate = this.patchItem(oldEndVnode, newEndVnode, oldEndIdx, newEndIdx, context); updated = willUpdate || updated; children[isNull(oldEndVnode.key) ? oldEndIdx : oldEndVnode.key] = willUpdate ? this._children[`${this._getChildName(newEndIdx)}-temp`] : this._children[this._getChildName(oldEndIdx)]; oldEndVnode = oldCh[--oldEndIdx]; newEndVnode = newCh[--newEndIdx]; } else if (sameVnode(oldStartVnode, newEndVnode)) { - const willUpdate = this.patchItem(oldStartVnode, newEndVnode, oldStartIdx, newStartIdx); + const willUpdate = this.patchItem(oldStartVnode, newEndVnode, oldStartIdx, newStartIdx, context); updated = willUpdate || updated; children[isNull(oldStartVnode.key) ? oldStartIdx : oldStartVnode.key] = willUpdate ? this._children[`${this._getChildName(newStartIdx)}-temp`] : this._children[this._getChildName(oldStartIdx)]; insertBefore(oldStartVnode, oldEndVnode, true); oldStartVnode = oldCh[++oldStartIdx]; newEndVnode = newCh[--newEndIdx]; } else if (sameVnode(oldEndVnode, newStartVnode)) { - const willUpdate = this.patchItem(oldEndVnode, newStartVnode, oldEndIdx, newEndIdx); + const willUpdate = this.patchItem(oldEndVnode, newStartVnode, oldEndIdx, newEndIdx, context); updated = willUpdate || updated; children[isNull(oldEndVnode) ? oldEndIdx : oldEndVnode.key] = willUpdate ? this._children[`${this._getChildName(newEndIdx)}-temp`] : this._children[this._getChildName(oldEndIdx)]; insertBefore(oldEndVnode, oldStartVnode); @@ -697,7 +715,7 @@ export class Layout extends Widget { insertBefore(node, oldStartVnode); } else { // 如果新节点在旧节点区间中存在就复用一下 const sameOldIndex = sameOldVnode[1]; - const willUpdate = this.patchItem(sameOldVnode[0], newStartVnode, sameOldIndex, newStartIdx); + const willUpdate = this.patchItem(sameOldVnode[0], newStartVnode, sameOldIndex, newStartIdx, context); updated = willUpdate || updated; children[isNull(sameOldVnode[0].key) ? newStartIdx : sameOldVnode[0].key] = willUpdate ? this._children[`${this._getChildName(newStartIdx)}-temp`] : this._children[this._getChildName(sameOldIndex)]; oldCh[sameOldIndex] = undefined; @@ -744,7 +762,7 @@ export class Layout extends Widget { const context = opt.context; const oldItems = o.items; this.options.items = items; - + return this.updateChildren(oldItems, items, context); } @@ -808,7 +826,7 @@ export class Layout extends Widget { items, context: options.context, }); - + return; } this.options.items = items;