From 7fae9a9aa6307a5e3618e7ac15a95372b092e5f0 Mon Sep 17 00:00:00 2001 From: Dailer Date: Sat, 18 Aug 2018 18:42:31 +0800 Subject: [PATCH] =?UTF-8?q?=E6=97=A0JIRA=E4=BB=BB=E5=8A=A1,invisible?= =?UTF-8?q?=E4=B8=BAtrue=E7=9A=84=E6=97=B6=E5=80=99=E4=B8=8Dcreate?= =?UTF-8?q?=E5=AD=90=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- dist/fix/fix.compact.js | 29 +- src/core/widget.js | 873 +++++++++++++++++++++------------------- 2 files changed, 469 insertions(+), 433 deletions(-) diff --git a/dist/fix/fix.compact.js b/dist/fix/fix.compact.js index ad610d6c7..f800018e4 100644 --- a/dist/fix/fix.compact.js +++ b/dist/fix/fix.compact.js @@ -1,5 +1,5 @@ ;(function () { - function initWatch (vm, watch) { + function initWatch(vm, watch) { vm._watchers || (vm._watchers = []); for (var key in watch) { var handler = watch[key]; @@ -13,7 +13,7 @@ } } - function createWatcher (vm, keyOrFn, handler) { + function createWatcher(vm, keyOrFn, handler) { return Fix.watch(vm.model, keyOrFn, _.bind(handler, vm), { store: vm.store }); @@ -22,24 +22,24 @@ var target = null; var targetStack = []; - function pushTarget (_target) { + function pushTarget(_target) { if (target) targetStack.push(target); Fix.Model.target = target = _target; } - function popTarget () { + function popTarget() { Fix.Model.target = target = targetStack.pop(); } var context = null; var contextStack = []; - function pushContext (_context) { + function pushContext(_context) { if (context) contextStack.push(context); Fix.Model.context = context = _context; } - function popContext () { + function popContext() { Fix.Model.context = context = contextStack.pop(); } @@ -60,7 +60,7 @@ }, options); }; - function findStore (widget) { + function findStore(widget) { if (target != null) { return target; } @@ -106,12 +106,11 @@ }; }); - var _init = BI.Widget.prototype._init; - BI.Widget.prototype._init = function () { - var self = this; + function createStore() { var needPop = false; - if (window.Fix && this._store) { + if (!this._storeCreated && window.Fix && this._store && this.isVisible()) { var store = findStore(this.options.context || this.options.element); + this._storeCreated = true; if (store) { pushTarget(store); needPop = true; @@ -128,6 +127,13 @@ } needPop = true; } + return needPop; + } + + var _init = BI.Widget.prototype._init; + BI.Widget.prototype._init = function () { + var self = this; + var needPop = createStore.call(this); _init.apply(this, arguments); needPop && popTarget(); }; @@ -166,6 +172,7 @@ _.each(["_mount"], function (name) { var old = BI.Widget.prototype[name]; old && (BI.Widget.prototype[name] = function () { + createStore.call(this); this.store && pushTarget(this.store); var res = old.apply(this, arguments); this.store && popTarget(); diff --git a/src/core/widget.js b/src/core/widget.js index f922fa722..5b7c8f601 100644 --- a/src/core/widget.js +++ b/src/core/widget.js @@ -5,466 +5,495 @@ * * @cfg {JSON} options 配置属性 */ -BI.Widget = BI.inherit(BI.OB, { - _defaultConfig: function () { - return BI.extend(BI.Widget.superclass._defaultConfig.apply(this), { - root: false, - tagName: "div", - attributes: null, - data: null, - - tag: null, - disabled: false, - invisible: false, - invalid: false, - baseCls: "", - extraCls: "", - cls: "" - }); - }, - - beforeInit: null, - - // 生命周期函数 - beforeCreate: null, - - created: null, - - render: null, - - beforeMount: null, - - mounted: null, - - shouldUpdate: null, - - update: function () { - }, - - beforeDestroy: null, - - destroyed: null, - - _init: function () { - BI.Widget.superclass._init.apply(this, arguments); - this._initRoot(); - this._initElementWidth(); - this._initElementHeight(); - this._initVisual(); - this._initState(); - if (this.beforeInit) { - this.__asking = true; - this.beforeInit(BI.bind(this._render, this)); - if (this.__asking === true) { - this.__async = true; + +!(function () { + var lazy = (typeof document !== 'undefined' && + typeof document.documentMode === 'number') || + (typeof navigator !== 'undefined' && + typeof navigator.userAgent === 'string' && + /\bEdge\/\d/.test(navigator.userAgent)); + BI.Widget = BI.inherit(BI.OB, { + _defaultConfig: function () { + return BI.extend(BI.Widget.superclass._defaultConfig.apply(this), { + root: false, + tagName: "div", + attributes: null, + data: null, + + tag: null, + disabled: false, + invisible: false, + invalid: false, + baseCls: "", + extraCls: "", + cls: "" + }); + }, + + beforeInit: null, + + // 生命周期函数 + beforeCreate: null, + + created: null, + + render: null, + + beforeMount: null, + + mounted: null, + + shouldUpdate: null, + + update: function () { + }, + + beforeDestroy: null, + + destroyed: null, + + _init: function () { + BI.Widget.superclass._init.apply(this, arguments); + this._initRoot(); + this._initElementWidth(); + this._initElementHeight(); + this._initVisual(); + this._initState(); + if (this.isVisible()) { + if (this.beforeInit) { + this.__asking = true; + this.beforeInit(BI.bind(this._render, this)); + if (this.__asking === true) { + this.__async = true; + } + } else { + this._render(); + } + this.rendered = true } - } else { - this._render(); - } - }, - - _render: function () { - this.__asking = false; - this.beforeCreate && this.beforeCreate(); - this._initElement(); - this._initEffects(); - this.created && this.created(); - }, - - /** - * 初始化根节点 - * @private - */ - _initRoot: function () { - var o = this.options; - this.widgetName = o.widgetName || BI.uniqueId("widget"); - this._isRoot = o.root; - if (BI.isWidget(o.element)) { - if (o.element instanceof BI.Widget) { - this._parent = o.element; - this._parent.addWidget(this.widgetName, this); - } else { + if (this._isRoot) { + this._mount() + } + }, + + _render: function () { + this.__asking = false; + this.beforeCreate && this.beforeCreate(); + this._initElement(); + this._initEffects(); + this.created && this.created(); + }, + + /** + * 初始化根节点 + * @private + */ + _initRoot: function () { + var o = this.options; + this.widgetName = o.widgetName || BI.uniqueId("widget"); + this._isRoot = o.root; + if (BI.isWidget(o.element)) { + if (o.element instanceof BI.Widget) { + this._parent = o.element; + this._parent.addWidget(this.widgetName, this); + } else { + this._isRoot = true; + } + this.element = this.options.element.element; + } else if (o.element) { + // if (o.root !== true) { + // throw new Error("root is a required property"); + // } + this.element = $(o.element); this._isRoot = true; + } else { + this.element = $(document.createElement(o.tagName)); } - this.element = this.options.element.element; - } else if (o.element) { - // if (o.root !== true) { - // throw new Error("root is a required property"); - // } - this.element = $(o.element); - this._isRoot = true; - } else { - this.element = $(document.createElement(o.tagName)); - } - this.element._isWidget = true; - if (o.baseCls || o.extraCls || o.cls) { - this.element.addClass((o.baseCls || "") + " " + (o.extraCls || "") + " " + (o.cls || "")); - } - if (o.attributes) { - this.element.attr(o.attributes); - } - if (o.data) { - this.element.data(o.data); - } - this._children = {}; - }, - - _initElementWidth: function () { - var o = this.options; - if (BI.isWidthOrHeight(o.width)) { - this.element.css("width", o.width); - } - }, + this.element._isWidget = true; + if (o.baseCls || o.extraCls || o.cls) { + this.element.addClass((o.baseCls || "") + " " + (o.extraCls || "") + " " + (o.cls || "")); + } + if (o.attributes) { + this.element.attr(o.attributes); + } + if (o.data) { + this.element.data(o.data); + } + this._children = {}; + }, - _initElementHeight: function () { - var o = this.options; - if (BI.isWidthOrHeight(o.height)) { - this.element.css("height", o.height); - } - }, + _initElementWidth: function () { + var o = this.options; + if (BI.isWidthOrHeight(o.width)) { + this.element.css("width", o.width); + } + }, - _initVisual: function () { - var o = this.options; - if (o.invisible) { - // 用display属性做显示和隐藏，否则jquery会在显示时将display设为block会覆盖掉display:flex属性 - this.element.css("display", "none"); - } - }, + _initElementHeight: function () { + var o = this.options; + if (BI.isWidthOrHeight(o.height)) { + this.element.css("height", o.height); + } + }, - _initEffects: function () { - var o = this.options; - if (o.disabled || o.invalid) { - if (this.options.disabled) { - this.setEnable(false); + _initVisual: function () { + var o = this.options; + if (o.invisible) { + // 用display属性做显示和隐藏，否则jquery会在显示时将display设为block会覆盖掉display:flex属性 + this.element.css("display", "none"); } - if (this.options.invalid) { - this.setValid(false); + }, + + _initEffects: function () { + var o = this.options; + if (o.disabled || o.invalid) { + if (this.options.disabled) { + this.setEnable(false); + } + if (this.options.invalid) { + this.setValid(false); + } } - } - }, + }, - _initState: function () { - this._isMounted = false; - }, + _initState: function () { + this._isMounted = false; + }, - _initElement: function () { - var self = this; - var els = this.render && this.render(); - if (BI.isPlainObject(els)) { - els = [els]; - } - if (BI.isArray(els)) { - BI.each(els, function (i, el) { - BI.createWidget(el, { - element: self + _initElement: function () { + var self = this; + var els = this.render && this.render(); + if (BI.isPlainObject(els)) { + els = [els]; + } + if (BI.isArray(els)) { + BI.each(els, function (i, el) { + BI.createWidget(el, { + element: self + }); }); + } + // if (this._isRoot === true || !(this instanceof BI.Layout)) { + this._mount(); + // } + }, + + _setParent: function (parent) { + this._parent = parent; + }, + + _mount: function () { + var self = this; + var isMounted = this._isMounted; + if (this._isMounting || isMounted || !this.isVisible() || this.__asking === true) { + return; + } + if (this._isRoot === true) { + isMounted = true; + } else if (this._parent && this._parent._isMounted === true) { + isMounted = true; + } + if (!isMounted) { + return; + } + this._isMounting = true + if (!this.rendered) { + if (this.beforeInit) { + this.__asking = true; + this.beforeInit(BI.bind(this._render, this)); + if (this.__asking === true) { + this.__async = true; + } + } else { + this._render(); + } + } + + this.beforeMount && this.beforeMount(); + this._isMounted = true; + lazy && this._mountChildren && this._mountChildren(); + BI.each(this._children, function (i, widget) { + !self.isEnabled() && widget._setEnable(false); + !self.isValid() && widget._setValid(false); + widget._mount && widget._mount(); }); - } - // if (this._isRoot === true || !(this instanceof BI.Layout)) { - this._mount(); - // } - }, - - _setParent: function (parent) { - this._parent = parent; - }, - - _mount: function () { - var self = this; - var isMounted = this._isMounted; - if (isMounted || !this.isVisible() || this.__asking === true) { - return; - } - if (this._isRoot === true) { - isMounted = true; - } else if (this._parent && this._parent._isMounted === true) { - isMounted = true; - } - if (!isMounted) { - return; - } - this.beforeMount && this.beforeMount(); - this._isMounted = true; - this._mountChildren && this._mountChildren(); - BI.each(this._children, function (i, widget) { - !self.isEnabled() && widget._setEnable(false); - !self.isValid() && widget._setValid(false); - widget._mount && widget._mount(); - }); - this.mounted && this.mounted(); - }, - - _mountChildren: null, - - isMounted: function () { - return this._isMounted; - }, - - setWidth: function (w) { - this.options.width = w; - this._initElementWidth(); - }, - - setHeight: function (h) { - this.options.height = h; - this._initElementHeight(); - }, - - _setEnable: function (enable) { - if (enable === true) { - this.options.disabled = false; - } else if (enable === false) { - this.options.disabled = true; - } - // 递归将所有子组件使能 - BI.each(this._children, function (i, child) { - !child._manualSetEnable && child._setEnable && child._setEnable(enable); - }); - }, - - _setValid: function (valid) { - if (valid === true) { - this.options.invalid = false; - } else if (valid === false) { - this.options.invalid = true; - } - // 递归将所有子组件使有效 - BI.each(this._children, function (i, child) { - !child._manualSetValid && child._setValid && child._setValid(valid); - }); - }, - - _setVisible: function (visible) { - if (visible === true) { - this.options.invisible = false; - } else if (visible === false) { - this.options.invisible = true; - } - }, - - setEnable: function (enable) { - this._manualSetEnable = true; - this._setEnable(enable); - if (enable === true) { - this.element.removeClass("base-disabled disabled"); - } else if (enable === false) { - this.element.addClass("base-disabled disabled"); - } - }, + !lazy && this._mountChildren && this._mountChildren(); + this.mounted && this.mounted(); + this._isMounting = false + }, + + _mountChildren: null, + + isMounted: function () { + return this._isMounted; + }, + + setWidth: function (w) { + this.options.width = w; + this._initElementWidth(); + }, + + setHeight: function (h) { + this.options.height = h; + this._initElementHeight(); + }, + + _setEnable: function (enable) { + if (enable === true) { + this.options.disabled = false; + } else if (enable === false) { + this.options.disabled = true; + } + // 递归将所有子组件使能 + BI.each(this._children, function (i, child) { + !child._manualSetEnable && child._setEnable && child._setEnable(enable); + }); + }, - setVisible: function (visible) { - this._setVisible(visible); - if (visible === true) { - // 用this.element.show()会把display属性改成block - this.element.css("display", ""); - this._mount(); - } else if (visible === false) { - this.element.css("display", "none"); - } - this.fireEvent(BI.Events.VIEW, visible); - }, - - setValid: function (valid) { - this._manualSetValid = true; - this._setValid(valid); - if (valid === true) { - this.element.removeClass("base-invalid invalid"); - } else if (valid === false) { - this.element.addClass("base-invalid invalid"); - } - }, - - doBehavior: function () { - var args = arguments; - // 递归将所有子组件使有效 - BI.each(this._children, function (i, child) { - child.doBehavior && child.doBehavior.apply(child, args); - }); - }, - - getWidth: function () { - return this.options.width; - }, - - getHeight: function () { - return this.options.height; - }, - - isValid: function () { - return !this.options.invalid; - }, - - addWidget: function (name, widget) { - var self = this; - if (name instanceof BI.Widget) { - widget = name; - name = widget.getName(); - } - if (BI.isKey(name)) { - name = name + ""; - } - name = name || widget.getName() || BI.uniqueId("widget"); - if (this._children[name]) { - throw new Error("name has already been existed"); - } - widget._setParent && widget._setParent(this); - widget.on(BI.Events.DESTROY, function () { - BI.remove(self._children, this); - }); - return (this._children[name] = widget); - }, - - getWidgetByName: function (name) { - if (!BI.isKey(name) || name === this.getName()) { - return this; - } - name = name + ""; - var widget = void 0, other = {}; - BI.any(this._children, function (i, wi) { - if (i === name) { - widget = wi; - return true; + _setValid: function (valid) { + if (valid === true) { + this.options.invalid = false; + } else if (valid === false) { + this.options.invalid = true; } - other[i] = wi; - }); - if (!widget) { - BI.any(other, function (i, wi) { - return (widget = wi.getWidgetByName(i)); + // 递归将所有子组件使有效 + BI.each(this._children, function (i, child) { + !child._manualSetValid && child._setValid && child._setValid(valid); }); - } - return widget; - }, - - removeWidget: function (nameOrWidget) { - var self = this; - if (BI.isWidget(nameOrWidget)) { - BI.remove(this._children, nameOrWidget); - } else { - delete this._children[nameOrWidget]; - } - }, + }, + + _setVisible: function (visible) { + if (visible === true) { + this.options.invisible = false; + } else if (visible === false) { + this.options.invisible = true; + } + }, + + setEnable: function (enable) { + this._manualSetEnable = true; + this._setEnable(enable); + if (enable === true) { + this.element.removeClass("base-disabled disabled"); + } else if (enable === false) { + this.element.addClass("base-disabled disabled"); + } + }, + + setVisible: function (visible) { + this._setVisible(visible); + if (visible === true) { + // 用this.element.show()会把display属性改成block + this.element.css("display", ""); + this._mount(); + } else if (visible === false) { + this.element.css("display", "none"); + } + this.fireEvent(BI.Events.VIEW, visible); + }, + + setValid: function (valid) { + this._manualSetValid = true; + this._setValid(valid); + if (valid === true) { + this.element.removeClass("base-invalid invalid"); + } else if (valid === false) { + this.element.addClass("base-invalid invalid"); + } + }, - hasWidget: function (name) { - return this._children[name] != null; - }, + doBehavior: function () { + var args = arguments; + // 递归将所有子组件使有效 + BI.each(this._children, function (i, child) { + child.doBehavior && child.doBehavior.apply(child, args); + }); + }, - getName: function () { - return this.widgetName; - }, + getWidth: function () { + return this.options.width; + }, - setTag: function (tag) { - this.options.tag = tag; - }, + getHeight: function () { + return this.options.height; + }, - getTag: function () { - return this.options.tag; - }, + isValid: function () { + return !this.options.invalid; + }, - attr: function (key, value) { - var self = this; - if (BI.isPlainObject(key)) { - BI.each(key, function (k, v) { - self.attr(k, v); + addWidget: function (name, widget) { + var self = this; + if (name instanceof BI.Widget) { + widget = name; + name = widget.getName(); + } + if (BI.isKey(name)) { + name = name + ""; + } + name = name || widget.getName() || BI.uniqueId("widget"); + if (this._children[name]) { + throw new Error("name has already been existed"); + } + widget._setParent && widget._setParent(this); + widget.on(BI.Events.DESTROY, function () { + BI.remove(self._children, this); }); - return; - } - if (BI.isNotNull(value)) { - return this.options[key] = value; - } - return this.options[key]; - }, + return (this._children[name] = widget); + }, - getText: function () { + getWidgetByName: function (name) { + if (!BI.isKey(name) || name === this.getName()) { + return this; + } + name = name + ""; + var widget = void 0, other = {}; + BI.any(this._children, function (i, wi) { + if (i === name) { + widget = wi; + return true; + } + other[i] = wi; + }); + if (!widget) { + BI.any(other, function (i, wi) { + return (widget = wi.getWidgetByName(i)); + }); + } + return widget; + }, - }, + removeWidget: function (nameOrWidget) { + var self = this; + if (BI.isWidget(nameOrWidget)) { + BI.remove(this._children, nameOrWidget); + } else { + delete this._children[nameOrWidget]; + } + }, - setText: function (text) { + hasWidget: function (name) { + return this._children[name] != null; + }, - }, + getName: function () { + return this.widgetName; + }, - getValue: function () { + setTag: function (tag) { + this.options.tag = tag; + }, - }, + getTag: function () { + return this.options.tag; + }, - setValue: function (value) { + attr: function (key, value) { + var self = this; + if (BI.isPlainObject(key)) { + BI.each(key, function (k, v) { + self.attr(k, v); + }); + return; + } + if (BI.isNotNull(value)) { + return this.options[key] = value; + } + return this.options[key]; + }, + + getText: function () { + + }, + + setText: function (text) { + + }, - }, + getValue: function () { - isEnabled: function () { - return !this.options.disabled; - }, + }, - isVisible: function () { - return !this.options.invisible; - }, + setValue: function (value) { - disable: function () { - this.setEnable(false); - }, + }, - enable: function () { - this.setEnable(true); - }, + isEnabled: function () { + return !this.options.disabled; + }, - valid: function () { - this.setValid(true); - }, + isVisible: function () { + return !this.options.invisible; + }, - invalid: function () { - this.setValid(false); - }, + disable: function () { + this.setEnable(false); + }, - invisible: function () { - this.setVisible(false); - }, + enable: function () { + this.setEnable(true); + }, - visible: function () { - this.setVisible(true); - }, + valid: function () { + this.setValid(true); + }, - __d: function () { - this.beforeDestroy && this.beforeDestroy(); - BI.each(this._children, function (i, widget) { - widget && widget._unMount && widget._unMount(); - }); - this._children = {}; - this._parent = null; - this._isMounted = false; - this.destroyed && this.destroyed(); - }, + invalid: function () { + this.setValid(false); + }, - _unMount: function () { - this.__d(); - this.fireEvent(BI.Events.UNMOUNT); - this.purgeListeners(); - }, + invisible: function () { + this.setVisible(false); + }, - isolate: function () { - if (this._parent) { - this._parent.removeWidget(this); + visible: function () { + this.setVisible(true); + }, + + __d: function () { + this.beforeDestroy && this.beforeDestroy(); + BI.each(this._children, function (i, widget) { + widget && widget._unMount && widget._unMount(); + }); + this._children = {}; + this._parent = null; + this._isMounted = false; + this.destroyed && this.destroyed(); + }, + + _unMount: function () { + this.__d(); + this.fireEvent(BI.Events.UNMOUNT); + this.purgeListeners(); + }, + + isolate: function () { + if (this._parent) { + this._parent.removeWidget(this); + } + BI.DOM.hang([this]); + }, + + empty: function () { + BI.each(this._children, function (i, widget) { + widget && widget._unMount && widget._unMount(); + }); + this._children = {}; + this.element.empty(); + }, + + _destroy: function () { + this.__d(); + this.element.destroy(); + this.purgeListeners(); + }, + + destroy: function () { + this.__d(); + this.element.destroy(); + this.fireEvent(BI.Events.DESTROY); + this._purgeRef(); + this.purgeListeners(); } - BI.DOM.hang([this]); - }, - - empty: function () { - BI.each(this._children, function (i, widget) { - widget && widget._unMount && widget._unMount(); - }); - this._children = {}; - this.element.empty(); - }, - - _destroy: function () { - this.__d(); - this.element.destroy(); - this.purgeListeners(); - }, - - destroy: function () { - this.__d(); - this.element.destroy(); - this.fireEvent(BI.Events.DESTROY); - this._purgeRef(); - this.purgeListeners(); - } -}); \ No newline at end of file + }); +})(); \ No newline at end of file