zhangyuhan 3 жил өмнө
parent
commit
291090d9b9
1 өөрчлөгдсөн 67 нэмэгдсэн , 2 устгасан
  1. 67 2
      README.md

+ 67 - 2
README.md

@@ -13,10 +13,11 @@ yarn add @jianyu/easy-inject-qiankun --dev
 ## Usage
 
 ```javascript
-// main.js
+// # 子应用 main.js
+// [可选] 修改 __webpack_public_path__ 
+import '@jianyu/easy-inject-qiankun/src/pre-mount'
 
 // 自动判断环境初始化子应用、注册子应用钩子
-
 export const { bootstrap, mount, unmount } = easySubAppRegister({
   Vue,
   router,
@@ -31,6 +32,70 @@ export const { bootstrap, mount, unmount } = easySubAppRegister({
 export const { bootstrap, mount, unmount } = subAppRegister({
   render
 })
+
+// qiankun hooks
+export const { bootstrap, mount, unmount } = easySubAppRegister({
+  Vue,
+  router,
+  store,
+  App,
+  el: '#app'
+}, Lifecycle)
+
+
+// 子应用是否可独立渲染,非 'development' 时不渲染,默认值 'development'
+export const { bootstrap, mount, unmount } = easySubAppRegister({
+  Vue,
+  router,
+  store,
+  App,
+  el: '#app'
+}, Lifecycle, 'development')
+```
+### Extended use
+```
+// 【基座】配置,可前往参考工作桌面应用
+registerMicroApps([
+  ...
+  props: {
+    // 路由变量
+    __QIANKUN_ROUTER_BASE: '路由配置,同 activeRule',
+    // 钩子配置
+    hooks: {
+      // 示例: 子应用调用该方法,打开外部链接
+      openLink ({ link, options = {} }) {}
+    },
+    className: 'in-app'
+  }
+], {
+  beforeLoad: (app) => {
+      // 通过钩子自动注入路由路径
+      if (app.props.__QIANKUN_ROUTER_BASE) {
+        window.__QIANKUN_ROUTER_BASE = app.props.__QIANKUN_ROUTER_BASE
+      }
+  }
+})
+```
+
+```javascript
+// 子应用调用基座钩子
+// 基座 hooks 钩子已经自动注入到 Vue.prototype.$BraceHooks
+import { tryCallHooks } from '@jianyu/easy-inject-qiankun'
+
+/**
+ * 尝试函数调用
+ * @param hooks
+ * @param fn
+ * @param arg
+ * @param spareFn - 备用函数
+ * @returns {*}
+ */
+ 
+tryCallHooks(this.$BraceHooks, 'openLink', {
+    link: 'xxx'
+}, () => {
+  location.href = 'xxx'
+})
 ```