|
|
|
|
@ -6,12 +6,27 @@
|
|
|
|
|
* @cfg {JSON} options 配置属性 |
|
|
|
|
*/ |
|
|
|
|
|
|
|
|
|
import { isFunction, isArray, each, extend, isPlainObject, isNull, uniqueId, isWidget, isWidthOrHeight, isKey, remove, any, isNotNull } from "./2.base"; |
|
|
|
|
import { |
|
|
|
|
isFunction, |
|
|
|
|
isArray, |
|
|
|
|
each, |
|
|
|
|
extend, |
|
|
|
|
isPlainObject, |
|
|
|
|
isNull, |
|
|
|
|
uniqueId, |
|
|
|
|
isWidget, |
|
|
|
|
isWidthOrHeight, |
|
|
|
|
isKey, |
|
|
|
|
remove, |
|
|
|
|
any, |
|
|
|
|
isNotNull |
|
|
|
|
} from "./2.base"; |
|
|
|
|
import { OB } from "./3.ob"; |
|
|
|
|
import { Providers, _lazyCreateWidget } from "./5.inject"; |
|
|
|
|
import { DOM } from "./utils"; |
|
|
|
|
import { Events, emptyFn, pixFormat } from "./constant"; |
|
|
|
|
import { Plugin } from "./6.plugin"; |
|
|
|
|
import { _global } from "./0.foundation"; |
|
|
|
|
|
|
|
|
|
const cancelAnimationFrame = |
|
|
|
|
_global.cancelAnimationFrame || |
|
|
|
|
@ -21,10 +36,17 @@ const cancelAnimationFrame =
|
|
|
|
|
_global.msCancelAnimationFrame || |
|
|
|
|
_global.clearTimeout; |
|
|
|
|
|
|
|
|
|
const requestAnimationFrame = _global.requestAnimationFrame || _global.webkitRequestAnimationFrame || _global.mozRequestAnimationFrame || _global.oRequestAnimationFrame || _global.msRequestAnimationFrame || _global.setTimeout; |
|
|
|
|
const requestAnimationFrame = |
|
|
|
|
_global.requestAnimationFrame || |
|
|
|
|
_global.webkitRequestAnimationFrame || |
|
|
|
|
_global.mozRequestAnimationFrame || |
|
|
|
|
_global.oRequestAnimationFrame || |
|
|
|
|
_global.msRequestAnimationFrame || |
|
|
|
|
_global.setTimeout; |
|
|
|
|
|
|
|
|
|
function callLifeHook(self, life) { |
|
|
|
|
let hooks = [], hook; |
|
|
|
|
let hooks = [], |
|
|
|
|
hook; |
|
|
|
|
hook = self[life]; |
|
|
|
|
if (hook) { |
|
|
|
|
hooks = hooks.concat(isArray(hook) ? hook : [hook]); |
|
|
|
|
@ -39,7 +61,7 @@ function callLifeHook(self, life) {
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
export class Widget extends OB { |
|
|
|
|
_defaultConfig () { |
|
|
|
|
_defaultConfig() { |
|
|
|
|
return extend(super._defaultConfig(), { |
|
|
|
|
root: false, |
|
|
|
|
tagName: "div", |
|
|
|
|
@ -56,18 +78,16 @@ export class Widget extends OB {
|
|
|
|
|
baseCls: "", |
|
|
|
|
extraCls: "", |
|
|
|
|
cls: "", |
|
|
|
|
css: null, |
|
|
|
|
css: null |
|
|
|
|
|
|
|
|
|
// vdom: false
|
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
_constructor () { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
_constructor() {} |
|
|
|
|
|
|
|
|
|
// 覆盖父类的_constructor方法，widget不走ob的生命周期
|
|
|
|
|
_constructed () { |
|
|
|
|
_constructed() { |
|
|
|
|
if (this.setup) { |
|
|
|
|
pushTarget(this); |
|
|
|
|
const delegate = this.setup(this.options); |
|
|
|
|
@ -81,7 +101,7 @@ export class Widget extends OB {
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
_lazyConstructor () { |
|
|
|
|
_lazyConstructor() { |
|
|
|
|
if (!this.__constructed) { |
|
|
|
|
this.__constructed = true; |
|
|
|
|
this._init(); |
|
|
|
|
@ -134,8 +154,11 @@ export class Widget extends OB {
|
|
|
|
|
const init = () => { |
|
|
|
|
// 加个保险
|
|
|
|
|
if (initCallbackCalled === true) { |
|
|
|
|
_global.console && console.error("组件： 请检查beforeInit内部的写法，callback只能执行一次"); |
|
|
|
|
|
|
|
|
|
_global.console && |
|
|
|
|
console.error( |
|
|
|
|
"组件： 请检查beforeInit内部的写法，callback只能执行一次" |
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
initCallbackCalled = true; |
|
|
|
|
@ -143,8 +166,11 @@ export class Widget extends OB {
|
|
|
|
|
const render = () => { |
|
|
|
|
// 加个保险
|
|
|
|
|
if (renderCallbackCalled === true) { |
|
|
|
|
_global.console && console.error("组件： 请检查beforeRender内部的写法，callback只能执行一次"); |
|
|
|
|
|
|
|
|
|
_global.console && |
|
|
|
|
console.error( |
|
|
|
|
"组件： 请检查beforeRender内部的写法，callback只能执行一次" |
|
|
|
|
); |
|
|
|
|
|
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
renderCallbackCalled = true; |
|
|
|
|
@ -154,9 +180,11 @@ export class Widget extends OB {
|
|
|
|
|
|
|
|
|
|
if (this.options.beforeRender || this.beforeRender) { |
|
|
|
|
this.__async = true; |
|
|
|
|
const beforeRenderResult = (this.options.beforeRender || this.beforeRender).call(this, render); |
|
|
|
|
const beforeRenderResult = ( |
|
|
|
|
this.options.beforeRender || this.beforeRender |
|
|
|
|
).call(this, render); |
|
|
|
|
if (beforeRenderResult instanceof Promise) { |
|
|
|
|
beforeRenderResult.then(render).catch(e => { |
|
|
|
|
beforeRenderResult.then(render).catch((e) => { |
|
|
|
|
_global.console && console.error(e); |
|
|
|
|
render(); |
|
|
|
|
}); |
|
|
|
|
@ -169,9 +197,11 @@ export class Widget extends OB {
|
|
|
|
|
|
|
|
|
|
if (this.options.beforeInit || this.beforeInit) { |
|
|
|
|
this.__asking = true; |
|
|
|
|
const beforeInitResult = (this.options.beforeInit || this.beforeInit).call(this, init); |
|
|
|
|
const beforeInitResult = ( |
|
|
|
|
this.options.beforeInit || this.beforeInit |
|
|
|
|
).call(this, init); |
|
|
|
|
if (beforeInitResult instanceof Promise) { |
|
|
|
|
beforeInitResult.then(init).catch(e => { |
|
|
|
|
beforeInitResult.then(init).catch((e) => { |
|
|
|
|
_global.console && console.error(e); |
|
|
|
|
init(); |
|
|
|
|
}); |
|
|
|
|
@ -211,12 +241,14 @@ export class Widget extends OB {
|
|
|
|
|
this._initElementWidth(); |
|
|
|
|
this._initElementHeight(); |
|
|
|
|
if (o._baseCls || o.baseCls || o.extraCls) { |
|
|
|
|
this.element.addClass(`${o._baseCls || ""} ${o.baseCls || ""} ${o.extraCls || ""}`); |
|
|
|
|
this.element.addClass( |
|
|
|
|
`${o._baseCls || ""} ${o.baseCls || ""} ${o.extraCls || ""}` |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
if (o.cls) { |
|
|
|
|
if (isFunction(o.cls)) { |
|
|
|
|
let cls = this.__watch(o.cls, (context, newValue) => { |
|
|
|
|
this.element.removeClass(cls).addClass(cls = newValue); |
|
|
|
|
this.element.removeClass(cls).addClass((cls = newValue)); |
|
|
|
|
}); |
|
|
|
|
this.element.addClass(cls); |
|
|
|
|
} else { |
|
|
|
|
@ -240,7 +272,7 @@ export class Widget extends OB {
|
|
|
|
|
newValue[k] = ""; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
this.element.css(css = newValue); |
|
|
|
|
this.element.css((css = newValue)); |
|
|
|
|
}); |
|
|
|
|
this.element.css(css); |
|
|
|
|
} else { |
|
|
|
|
@ -252,13 +284,20 @@ export class Widget extends OB {
|
|
|
|
|
__watch(getter, handler, options) { |
|
|
|
|
if (_global.Fix) { |
|
|
|
|
this._watchers = this._watchers || []; |
|
|
|
|
const watcher = new Fix.Watcher(null, () => getter.call(this, this), (handler && (v => { |
|
|
|
|
handler.call(this, this, v); |
|
|
|
|
})) || emptyFn, extend({ deep: true }, options)); |
|
|
|
|
const watcher = new Fix.Watcher( |
|
|
|
|
null, |
|
|
|
|
() => getter.call(this, this), |
|
|
|
|
(handler && |
|
|
|
|
((v) => { |
|
|
|
|
handler.call(this, this, v); |
|
|
|
|
})) || |
|
|
|
|
emptyFn, |
|
|
|
|
extend({ deep: true }, options) |
|
|
|
|
); |
|
|
|
|
this._watchers.push(() => { |
|
|
|
|
watcher.teardown(); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return watcher.value; |
|
|
|
|
} else { |
|
|
|
|
return getter(); |
|
|
|
|
@ -277,7 +316,8 @@ export class Widget extends OB {
|
|
|
|
|
if (isWidget(o.element)) { |
|
|
|
|
this.element = this.options.element.element; |
|
|
|
|
this._parent = o.element; |
|
|
|
|
this._parent._children && this._parent.addWidget(this.widgetName, this); |
|
|
|
|
this._parent._children && |
|
|
|
|
this._parent.addWidget(this.widgetName, this); |
|
|
|
|
} else if (o.element) { |
|
|
|
|
this.element = Widget._renderEngine.createElement(this); |
|
|
|
|
this._isRoot = true; |
|
|
|
|
@ -308,9 +348,11 @@ export class Widget extends OB {
|
|
|
|
|
_initVisual() { |
|
|
|
|
const o = this.options; |
|
|
|
|
if (o.invisible) { |
|
|
|
|
const invisible = o.invisible = isFunction(o.invisible) ? this.__watch(o.invisible, (context, newValue) => { |
|
|
|
|
this.setVisible(!newValue); |
|
|
|
|
}) : o.invisible; |
|
|
|
|
const invisible = (o.invisible = isFunction(o.invisible) |
|
|
|
|
? this.__watch(o.invisible, (context, newValue) => { |
|
|
|
|
this.setVisible(!newValue); |
|
|
|
|
}) |
|
|
|
|
: o.invisible); |
|
|
|
|
if (invisible) { |
|
|
|
|
// 用display属性做显示和隐藏，否则jquery会在显示时将display设为block会覆盖掉display:flex属性
|
|
|
|
|
this.__setElementVisible(false); |
|
|
|
|
@ -322,17 +364,21 @@ export class Widget extends OB {
|
|
|
|
|
const o = this.options; |
|
|
|
|
if (o.disabled || o.invalid) { |
|
|
|
|
if (this.options.disabled) { |
|
|
|
|
const disabled = o.disabled = isFunction(o.disabled) ? this.__watch(o.disabled, (context, newValue) => { |
|
|
|
|
this.setEnable(!newValue); |
|
|
|
|
}) : o.disabled; |
|
|
|
|
const disabled = (o.disabled = isFunction(o.disabled) |
|
|
|
|
? this.__watch(o.disabled, (context, newValue) => { |
|
|
|
|
this.setEnable(!newValue); |
|
|
|
|
}) |
|
|
|
|
: o.disabled); |
|
|
|
|
if (disabled) { |
|
|
|
|
this.setEnable(false); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
if (this.options.invalid) { |
|
|
|
|
const invalid = o.invalid = isFunction(o.invalid) ? this.__watch(o.invalid, (context, newValue) => { |
|
|
|
|
this.setValid(!newValue); |
|
|
|
|
}) : o.invalid; |
|
|
|
|
const invalid = (o.invalid = isFunction(o.invalid) |
|
|
|
|
? this.__watch(o.invalid, (context, newValue) => { |
|
|
|
|
this.setValid(!newValue); |
|
|
|
|
}) |
|
|
|
|
: o.invalid); |
|
|
|
|
if (invalid) { |
|
|
|
|
this.setValid(false); |
|
|
|
|
} |
|
|
|
|
@ -365,10 +411,17 @@ export class Widget extends OB {
|
|
|
|
|
_initElement() { |
|
|
|
|
this.__isMounting = true; |
|
|
|
|
// 当开启worker模式时，可以通过$render来实现另一种效果
|
|
|
|
|
const workerMode = Providers.getProvider("bi.provider.system").getWorkerMode(); |
|
|
|
|
const render = isFunction(this.options.render) ? this.options.render : (workerMode ? (this.$render || this.render) : this.render); |
|
|
|
|
const workerMode = |
|
|
|
|
Providers.getProvider("bi.provider.system").getWorkerMode(); |
|
|
|
|
const render = isFunction(this.options.render) |
|
|
|
|
? this.options.render |
|
|
|
|
: workerMode |
|
|
|
|
? this.$render || this.render |
|
|
|
|
: this.render; |
|
|
|
|
let els = render && render.call(this); |
|
|
|
|
els = this.options.configRender ? this.options.configRender.call(this, els) : els; |
|
|
|
|
els = this.options.configRender |
|
|
|
|
? this.options.configRender.call(this, els) |
|
|
|
|
: els; |
|
|
|
|
els = Plugin.getRender(this.options.type, els); |
|
|
|
|
if (isPlainObject(els)) { |
|
|
|
|
els = [els]; |
|
|
|
|
@ -378,7 +431,7 @@ export class Widget extends OB {
|
|
|
|
|
each(els, (i, el) => { |
|
|
|
|
if (el) { |
|
|
|
|
_lazyCreateWidget(el, { |
|
|
|
|
element: this, |
|
|
|
|
element: this |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
@ -400,16 +453,34 @@ export class Widget extends OB {
|
|
|
|
|
* @private |
|
|
|
|
*/ |
|
|
|
|
_mount(force, deep, lifeHook, predicate, layer) { |
|
|
|
|
if (!force && (this._isMounted || !this.isVisible() || this.__asking === true || !(this._isRoot === true || (this._parent && this._parent._isMounted === true)))) { |
|
|
|
|
if ( |
|
|
|
|
!force && |
|
|
|
|
(this._isMounted || |
|
|
|
|
!this.isVisible() || |
|
|
|
|
this.__asking === true || |
|
|
|
|
!( |
|
|
|
|
this._isRoot === true || |
|
|
|
|
(this._parent && this._parent._isMounted === true) |
|
|
|
|
)) |
|
|
|
|
) { |
|
|
|
|
return false; |
|
|
|
|
} |
|
|
|
|
layer = layer || 0; |
|
|
|
|
lifeHook !== false && !this.__async && callLifeHook(this, "beforeMount"); |
|
|
|
|
lifeHook !== false && |
|
|
|
|
!this.__async && |
|
|
|
|
callLifeHook(this, "beforeMount"); |
|
|
|
|
this._isMounted = true; |
|
|
|
|
this.__isMounting = false; |
|
|
|
|
for (const key in this._children) { |
|
|
|
|
const child = this._children[key]; |
|
|
|
|
child._mount && child._mount(deep ? force : false, deep, lifeHook, predicate, layer + 1); |
|
|
|
|
child._mount && |
|
|
|
|
child._mount( |
|
|
|
|
deep ? force : false, |
|
|
|
|
deep, |
|
|
|
|
lifeHook, |
|
|
|
|
predicate, |
|
|
|
|
layer + 1 |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
if (this._parent) { |
|
|
|
|
if (!this._parent.isEnabled()) { |
|
|
|
|
@ -426,7 +497,7 @@ export class Widget extends OB {
|
|
|
|
|
this.__afterMount(lifeHook, predicate); |
|
|
|
|
// }, 0);
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return true; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -454,7 +525,7 @@ export class Widget extends OB {
|
|
|
|
|
res = this.update && this.update(nextProps, shouldUpdate); |
|
|
|
|
} |
|
|
|
|
callLifeHook(this, "updated"); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return res; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -484,7 +555,9 @@ export class Widget extends OB {
|
|
|
|
|
} |
|
|
|
|
// 递归将所有子组件使能
|
|
|
|
|
each(this._children, (i, child) => { |
|
|
|
|
!child._manualSetEnable && child._setEnable && child._setEnable(enable); |
|
|
|
|
!child._manualSetEnable && |
|
|
|
|
child._setEnable && |
|
|
|
|
child._setEnable(enable); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -532,7 +605,10 @@ export class Widget extends OB {
|
|
|
|
|
this.__setElementVisible(true); |
|
|
|
|
this._mount(); |
|
|
|
|
if (o.animation && !lastVisible) { |
|
|
|
|
this.element.removeClass(`${o.animation}-leave`).removeClass(`${o.animation}-leave-active`).addClass(`${o.animation}-enter`); |
|
|
|
|
this.element |
|
|
|
|
.removeClass(`${o.animation}-leave`) |
|
|
|
|
.removeClass(`${o.animation}-leave-active`) |
|
|
|
|
.addClass(`${o.animation}-enter`); |
|
|
|
|
if (this._requestAnimationFrame) { |
|
|
|
|
cancelAnimationFrame(this._requestAnimationFrame); |
|
|
|
|
} |
|
|
|
|
@ -544,12 +620,17 @@ export class Widget extends OB {
|
|
|
|
|
clearTimeout(this._animationDuring); |
|
|
|
|
} |
|
|
|
|
this._animationDuring = setTimeout(() => { |
|
|
|
|
this.element.removeClass(`${o.animation}-enter`).removeClass(`${o.animation}-enter-active`); |
|
|
|
|
this.element |
|
|
|
|
.removeClass(`${o.animation}-enter`) |
|
|
|
|
.removeClass(`${o.animation}-enter-active`); |
|
|
|
|
}, o.animationDuring); |
|
|
|
|
} |
|
|
|
|
} else if (visible === false) { |
|
|
|
|
if (o.animation && lastVisible) { |
|
|
|
|
this.element.removeClass(`${o.animation}-enter`).removeClass(`${o.animation}-enter-active`).addClass(`${o.animation}-leave`); |
|
|
|
|
this.element |
|
|
|
|
.removeClass(`${o.animation}-enter`) |
|
|
|
|
.removeClass(`${o.animation}-enter-active`) |
|
|
|
|
.addClass(`${o.animation}-leave`); |
|
|
|
|
if (this._requestAnimationFrame) { |
|
|
|
|
cancelAnimationFrame(this._requestAnimationFrame); |
|
|
|
|
} |
|
|
|
|
@ -561,7 +642,9 @@ export class Widget extends OB {
|
|
|
|
|
clearTimeout(this._animationDuring); |
|
|
|
|
} |
|
|
|
|
this._animationDuring = setTimeout(() => { |
|
|
|
|
this.element.removeClass(`${o.animation}-leave`).removeClass(`${o.animation}-leave-active`); |
|
|
|
|
this.element |
|
|
|
|
.removeClass(`${o.animation}-leave`) |
|
|
|
|
.removeClass(`${o.animation}-leave-active`); |
|
|
|
|
this.__setElementVisible(false); |
|
|
|
|
}, o.animationDuring); |
|
|
|
|
} else { |
|
|
|
|
@ -620,7 +703,7 @@ export class Widget extends OB {
|
|
|
|
|
// TODO: self待删
|
|
|
|
|
remove(self._children, this); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return (this._children[name] = widget); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -634,7 +717,7 @@ export class Widget extends OB {
|
|
|
|
|
any(this._children, (i, wi) => { |
|
|
|
|
if (i === name) { |
|
|
|
|
widget = wi; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return true; |
|
|
|
|
} |
|
|
|
|
other[i] = wi; |
|
|
|
|
@ -642,7 +725,7 @@ export class Widget extends OB {
|
|
|
|
|
if (!widget) { |
|
|
|
|
any(other, (i, wi) => (widget = wi.getWidgetByName(i))); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return widget; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -673,13 +756,13 @@ export class Widget extends OB {
|
|
|
|
|
attr(key, value) { |
|
|
|
|
if (isPlainObject(key)) { |
|
|
|
|
each(key, (k, v) => this.attr(k, v)); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
if (isNotNull(value)) { |
|
|
|
|
this.options[key] = value; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return this.options[key]; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -687,21 +770,13 @@ export class Widget extends OB {
|
|
|
|
|
return this.element.css(name, value); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
getText() { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
getText() {} |
|
|
|
|
|
|
|
|
|
setText(text) { |
|
|
|
|
setText(text) {} |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
getValue() { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
getValue() {} |
|
|
|
|
|
|
|
|
|
setValue(value) { |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
setValue(value) {} |
|
|
|
|
|
|
|
|
|
isEnabled() { |
|
|
|
|
return this.options.disabled === true ? false : !this.options._disabled; |
|
|
|
|
@ -775,7 +850,7 @@ export class Widget extends OB {
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
_empty () { |
|
|
|
|
_empty() { |
|
|
|
|
this._assetMounted(); |
|
|
|
|
each(this._children, (i, widget) => { |
|
|
|
|
widget && widget._unMount && widget._unMount(); |
|
|
|
|
@ -784,19 +859,19 @@ export class Widget extends OB {
|
|
|
|
|
this.element.empty(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
isolate () { |
|
|
|
|
isolate() { |
|
|
|
|
if (this._parent) { |
|
|
|
|
this._parent.removeWidget(this); |
|
|
|
|
} |
|
|
|
|
DOM.hang([this]); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
empty () { |
|
|
|
|
empty() { |
|
|
|
|
this._empty(); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// 默认的reset方法就是干掉重来
|
|
|
|
|
reset () { |
|
|
|
|
reset() { |
|
|
|
|
// 还在异步状态的不需要执行reset
|
|
|
|
|
if (this.__async === true || this.__asking === true) { |
|
|
|
|
return; |
|
|
|
|
@ -851,8 +926,10 @@ export class Widget extends OB {
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
let context = null, current = null; |
|
|
|
|
const contextStack = [], currentStack = []; |
|
|
|
|
let context = null, |
|
|
|
|
current = null; |
|
|
|
|
const contextStack = [], |
|
|
|
|
currentStack = []; |
|
|
|
|
|
|
|
|
|
Widget.pushContext = function (_context) { |
|
|
|
|
if (context) contextStack.push(context); |
|
|
|
|
@ -896,17 +973,17 @@ export function useStore(_store) {
|
|
|
|
|
let origin; |
|
|
|
|
if (_global.Proxy) { |
|
|
|
|
const proxy = new Proxy(delegate, { |
|
|
|
|
get (target, key) { |
|
|
|
|
get(target, key) { |
|
|
|
|
return Reflect.get(origin, key); |
|
|
|
|
}, |
|
|
|
|
set (target, key, value) { |
|
|
|
|
set(target, key, value) { |
|
|
|
|
return Reflect.set(origin, key, value); |
|
|
|
|
}, |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
current._store = function () { |
|
|
|
|
origin = (_store || currentStore).apply(this, arguments); |
|
|
|
|
delegate.$delegate = origin; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return origin; |
|
|
|
|
}; |
|
|
|
|
current.$storeDelegate = proxy; |
|
|
|
|
@ -916,11 +993,11 @@ export function useStore(_store) {
|
|
|
|
|
current._store = function () { |
|
|
|
|
const st = (_store || currentStore).apply(this, arguments); |
|
|
|
|
extend(delegate, st); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return st; |
|
|
|
|
}; |
|
|
|
|
current.$storeDelegate = delegate; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return current.$storeDelegate; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -945,11 +1022,11 @@ export function useContext(inject) {
|
|
|
|
|
} |
|
|
|
|
vm = vm._parent; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return null; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return vm; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -967,25 +1044,31 @@ export function watch(vm, watch, handler) {
|
|
|
|
|
const innerHandler = watch[key]; |
|
|
|
|
if (isArray(handler)) { |
|
|
|
|
for (let i = 0; i < handler.length; i++) { |
|
|
|
|
watchers.push(Fix.watch(vm.model, key, innerHandler, { |
|
|
|
|
store: vm, |
|
|
|
|
})); |
|
|
|
|
watchers.push( |
|
|
|
|
Fix.watch(vm.model, key, innerHandler, { |
|
|
|
|
store: vm |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
} else { |
|
|
|
|
watchers.push(Fix.watch(vm.model, key, innerHandler, { |
|
|
|
|
store: vm, |
|
|
|
|
})); |
|
|
|
|
watchers.push( |
|
|
|
|
Fix.watch(vm.model, key, innerHandler, { |
|
|
|
|
store: vm |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
// vm中一定有_widget
|
|
|
|
|
Widget.current._watchers || (Widget.current._watchers = []); |
|
|
|
|
Widget.current._watchers = Widget.current._watchers.concat(watchers); |
|
|
|
|
|
|
|
|
|
Widget.current._watchers = |
|
|
|
|
Widget.current._watchers.concat(watchers); |
|
|
|
|
|
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
handler = watch; |
|
|
|
|
watch = vm; |
|
|
|
|
Widget.current.$watchDelayCallbacks || (Widget.current.$watchDelayCallbacks = []); |
|
|
|
|
Widget.current.$watchDelayCallbacks || |
|
|
|
|
(Widget.current.$watchDelayCallbacks = []); |
|
|
|
|
Widget.current.$watchDelayCallbacks.push([watch, handler]); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@ -994,7 +1077,7 @@ export function onBeforeMount(beforeMount) {
|
|
|
|
|
if (current) { |
|
|
|
|
if (current.__isMounting) { |
|
|
|
|
beforeMount(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
if (!current.beforeMount) { |
|
|
|
|
@ -1010,7 +1093,7 @@ export function onMounted(mounted) {
|
|
|
|
|
if (current) { |
|
|
|
|
if (current._isMounted && !this.__async) { |
|
|
|
|
mounted(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
if (!current.mounted) { |
|
|
|
|
@ -1048,7 +1131,7 @@ Widget.registerRenderEngine = function (engine) {
|
|
|
|
|
Widget._renderEngine = engine; |
|
|
|
|
}; |
|
|
|
|
Widget.registerRenderEngine({ |
|
|
|
|
createElement (widget) { |
|
|
|
|
createElement(widget) { |
|
|
|
|
if (isWidget(widget)) { |
|
|
|
|
const o = widget.options; |
|
|
|
|
if (o.element) { |
|
|
|
|
@ -1057,15 +1140,15 @@ Widget.registerRenderEngine({
|
|
|
|
|
if (o.tagName) { |
|
|
|
|
return BI.$(document.createElement(o.tagName)); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return BI.$(document.createDocumentFragment()); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return BI.$(widget); |
|
|
|
|
}, |
|
|
|
|
createFragment () { |
|
|
|
|
createFragment() { |
|
|
|
|
return document.createDocumentFragment(); |
|
|
|
|
}, |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
export function mount(widget, container, predicate, hydrate) { |
|
|
|
|
@ -1087,7 +1170,7 @@ export function mount(widget, container, predicate, hydrate) {
|
|
|
|
|
const c = Widget._renderEngine.createElement; |
|
|
|
|
DOM.patchProps(widget.element, c(c(container).children()[0])); |
|
|
|
|
|
|
|
|
|
const triggerLifeHook = w => { |
|
|
|
|
const triggerLifeHook = (w) => { |
|
|
|
|
w.beforeMount && w.beforeMount(); |
|
|
|
|
w.mounted && w.mounted(); |
|
|
|
|
each(w._children, (i, child) => { |
|
|
|
|
@ -1096,12 +1179,12 @@ export function mount(widget, container, predicate, hydrate) {
|
|
|
|
|
}; |
|
|
|
|
// 最后触发组件树生命周期函数
|
|
|
|
|
triggerLifeHook(widget); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return res; |
|
|
|
|
} |
|
|
|
|
if (container) { |
|
|
|
|
Widget._renderEngine.createElement(container).append(widget.element); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return widget._mount(true, false, false, predicate); |
|
|
|
|
} |
|
|
|
|
|
Treecat
2 years ago