Browse Source

feat: add try hooks

zhangyuhan 3 years ago
parent
commit
2a30b13710
2 changed files with 41 additions and 11 deletions
  1. 38 11
      src/index.js
  2. 3 0
      src/pre-mount.js

+ 38 - 11
src/index.js

@@ -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 {}
   }
 }

+ 3 - 0
src/pre-mount.js

@@ -0,0 +1,3 @@
+if (window.__POWERED_BY_QIANKUN__) {
+  __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__
+}