|
@@ -1,28 +1,53 @@
|
|
|
+/**
|
|
|
+ * 尝试函数调用
|
|
|
+ * @param hooks
|
|
|
+ * @param fn
|
|
|
+ * @param arg
|
|
|
+ * @param spareFn - 备用函数
|
|
|
+ * @returns {*}
|
|
|
+ */
|
|
|
+export function tryCallHooks (hooks, fn, arg, spareFn = () => null) {
|
|
|
+ try {
|
|
|
+ if (!hooks) {
|
|
|
+ return spareFn(arg)
|
|
|
+ }
|
|
|
+ const callFn = hooks[fn]
|
|
|
+ if (typeof callFn === 'function') {
|
|
|
+ return callFn(arg)
|
|
|
+ } else {
|
|
|
+ spareFn(arg)
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ console.warn(e)
|
|
|
+ spareFn(arg)
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
/**
|
|
|
* 注册子应用钩子
|
|
|
* @param render
|
|
|
* @param instance
|
|
|
* @returns {{unmount: ((function(): Promise<void>)|*), bootstrap: ((function(*): Promise<void>)|*), mount: ((function(*): Promise<void>)|*)}}
|
|
|
*/
|
|
|
-export function subAppRegister ({ render } = {}) {
|
|
|
+export function subAppRegister ({ render, Lifecycle = {} } = {}) {
|
|
|
let instance
|
|
|
- return {
|
|
|
+ return Object.assign({}, Lifecycle, {
|
|
|
bootstrap: async function (props) {
|
|
|
- console.log('[sub-app] bootstrap', props)
|
|
|
+ tryCallHooks(Lifecycle, 'bootstrap', props)
|
|
|
},
|
|
|
mount: async function (props) {
|
|
|
- console.log('[sub-app] mount', props)
|
|
|
instance = render(props)
|
|
|
+ tryCallHooks(Lifecycle, 'mount', props)
|
|
|
},
|
|
|
unmount: async function () {
|
|
|
- console.log('[sub-app] unmount')
|
|
|
if (instance) {
|
|
|
instance.$destroy()
|
|
|
instance.$el.innerHTML = ''
|
|
|
instance = null
|
|
|
}
|
|
|
- },
|
|
|
- }
|
|
|
+ tryCallHooks(Lifecycle, 'unmount')
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
/**
|
|
@@ -31,10 +56,11 @@ export function subAppRegister ({ render } = {}) {
|
|
|
* @param env - 环境,仅 development 下初始化子应用
|
|
|
* @returns {{unmount: ((function(): Promise<void>)|*), bootstrap: ((function(*): Promise<void>)|*), mount: ((function(*): Promise<void>)|*)}}
|
|
|
*/
|
|
|
-export function easySubAppRegister (options, env = 'development') {
|
|
|
- const { Vue, router, store, App, el } = options
|
|
|
+export function easySubAppRegister (options, Lifecycle = {}, env = 'development') {
|
|
|
function render (props = {}) {
|
|
|
- const { container } = props
|
|
|
+ const { Vue, router, store, App, el, container, hooks = {}, className = 'in-app' } = Object.assign({}, options, props)
|
|
|
+ Vue.prototype.$BraceHooks = hooks
|
|
|
+ container.querySelector('#app').classList.add(className)
|
|
|
return new Vue({
|
|
|
router,
|
|
|
store,
|
|
@@ -43,8 +69,9 @@ export function easySubAppRegister (options, env = 'development') {
|
|
|
}
|
|
|
|
|
|
if (window.__POWERED_BY_QIANKUN__) {
|
|
|
- return subAppRegister({ render: render })
|
|
|
+ return subAppRegister({ render: render, Lifecycle })
|
|
|
} else if (env === 'development') {
|
|
|
render()
|
|
|
+ return {}
|
|
|
}
|
|
|
}
|