栗子

test/tapable-test/index.js → test/tapableTest/index.js

-/* eslint-disable */
 /*
  * @Author: flyharvest
  * @Date: 2020-07-14 14:09:40
- * @LastEditTime: 2020-07-20 15:54:52
+ * @LastEditTime: 2020-07-19 13:49:33
  * @LastEditors: flyharvest
  */
 import * as rem from '@lib/flexible'
 import { ajax } from '@lib/xhr'
 import services from '@lib/services'
 import { HandleDojoin } from '@lib/handleDojoin'
+import { CustomError } from '@lib/utils'
 import { CouponModal } from '@lib/couponModal'
-import { isFn } from '@lib/utils'
 import $ from 'jquery'
 import './index.less'
 
@@ -18,132 +17,94 @@ rem.setViewPort()
 rem.init(750, 750)
 
 services.use(ajax)
-const Dojoin = services.DoJoin
+const DoJoin = services.DoJoin
 
 
-const dojoin = new Dojoin()
-
-const couponModal = new CouponModal()
-
-const handleDojoin = new HandleDojoin()
-
-const handOut = (opts, sign, external = {}) => {
-  const steam = [dojoin, handleDojoin, couponModal]
-  steam.forEach(e => {
-    e.hooksDefine.forEach(name => {
-      const cb = (data) => {
-        const fn = opts[name]
-        if (fn && isFn(fn) && fn.then) {
-          return fn(data, external[name])
-        } else if (fn && isFn(fn)) {
-          return Promise.resolve(fn(data, external[name]))
-        } else {
-          return Promise.resolve()
-        }
-      }
-      e.hooks[name].tapPromise(sign, cb)
-    })
-  })
-}
-
-const coreMethods = {
+/**
+ * @description: 初始化并挂载，并挂载通用的周期
+ * @example: 
+ * @param {type} 
+ * @return: 
+ */
+const dojoin = new DoJoin({
   beforeDojoin (data) {
-    console.log('我被调用-core')
     return {
       haha: 123123
     }
+  }
+})
+
+const couponModal = new CouponModal({
+  close (type) {
+    return type
   },
-  mediaMsg () {
-    console.log(media + 'ss')
-  },
-  modifyDom ({ el }) {
-    $(el).find('.content').css({
+  replaceHtml (data) {
+    $(data).find('.content').css({
       background: 'red'
     })
   }
-}
+})
 
+const handleDojoin = new HandleDojoin({
+  mediaMsg (media) {
+    console.log(media + 'ss')
+  }
+})
 
 /**
- * @description:  假装这个methods 是由继承提供的。
+ * @description: 分配到不同模块的hooks
  * @example: 
  * @param {type} 
  * @return: 
  */
-const methods = {
-  beforeDojoin(data) {
-    console.log('我被调用了-skinName')
-    return {
-      lala: '123213'
+const allHooks = {
+  dojoin: dojoin.allHooksName,
+  handleDojoin: handleDojoin.allHooksName,
+  couponModal: couponModal.allHooksName
+}
+const handout = (opts = {}) => {
+  const cbs = {
+    dojoin: {},
+    handleDojoin: {},
+    couponModal: {}
   }
-  },
-  
-  modifyDom ({ el }, fn) {
-    console.log(fn)
-    $(el).find('.confirm').css({
-      background: 'green'
-    })
-    return {el}
+  for (const i in opts) {
+    if (opts[i]) {
+      for (const name in allHooks) {
+        if (allHooks[name].indexOf(i) > -1) {
+          cbs[name][i] = opts[i]
         }
-}
-
-handOut(methods, 'skinDefault', coreMethods)
-handOut(coreMethods, 'core')
-
-
-let inited = false
-const tempHandOut = (opts, sign, external1 = {}, external2 = {}) => {
-  if (inited) {
-    tempHandOut.setOpts(opts)
-    return
       }
-  inited = true
-  tempHandOut.setOpts(opts)
-  const steam = [dojoin, handleDojoin, couponModal]
-  steam.forEach(e => {
-    e.hooksDefine.forEach(name => {
-      const cb = (data) => {
-        const fn = tempHandOut.getOpts()[name]
-        if (fn && isFn(fn) && fn.then) {
-          return fn(data, external1[name], external2[name])
-        } else if (fn && isFn(fn)) {
-          return Promise.resolve(fn(data, external1[name], external2[name]))
-        } else {
-          return Promise.resolve()
     }
   }
-      e.hooks[name].tapPromise({
-        name: sign,
-        stage: -1
-      }, cb)
-    })
-  })
-}
-tempHandOut.setOpts = (opts) => {
-  tempHandOut.opts = opts
-  return opts
-}
-tempHandOut.getOpts = () => {
-  return tempHandOut.opts
+  return cbs
 }
 
-const $doJoin = (opts = {}) => {
-  tempHandOut(opts, 'skinTemp')
-  console.log(dojoin)
-  return dojoin.start().then(res => {
-      return handleDojoin.start(res)
+/**
+ * @description: 类比现在的dojoin
+ * @example: 
+ * @param {type} 
+ * @return: 
+ */
+const $doJoin = (opts) => {
+  const cbs = handout(opts)
+  console.log(cbs)
+  return dojoin.start(cbs.dojoin)
+    .then(res => {
+      return handleDojoin.handle(res, cbs.handleDojoin)
     })
     .then(res => {
-      return  couponModal.start(res)
+      return couponModal.show(res, cbs.couponModal)
     })
-    .then((data) => {
-      console.log(data)
+    .catch(err => {
+      if (err instanceof CustomError) {
+        console.log(err)
+      }
+      console.log(err)
     })
 }
 
-let times = 0
-const replaceHtml = ({ couponModalResolve }) => {
-  console.log(++times)
+const getDom = ({ couponModalResolve }) => {
   const loading = $('<div class="loading"></div>')
   loading.text('加载中...')
   $('body').append(loading)
@@ -163,23 +124,25 @@ const replaceHtml = ({ couponModalResolve }) => {
     }, 2000)
   })
 }
-$doJoin({
-  beforeDojoin (data) {
-    console.log('我被调用了-特殊')
-  }
-})
+
+/**
+ * @description: 调用
+ * @example: 
+ * @param {type} 
+ * @return: 
+ */
+$doJoin()
   .then(() => {
     return $doJoin({
-      replaceHtml
+      getDom
     })
   })
   .then(() => {
     $doJoin({
-      modifyDom ({el}) {
-        $(el).find('.close').css({
+      replaceHtml (data) {
+        $(data).find('.close').css({
           background: 'blue'
         })
-        return {el}
       }
     })
   })