@mpxjs/core 2.8.0-beta.5 → 2.8.1

package/@types/index.d.ts

@@ -107,7 +107,6 @@ interface Mixin<D, P, C, M> {
   properties?: P
   computed?: C
   methods?: M
-
   [index: string]: any
 }
 
@@ -119,9 +118,8 @@ type UnboxMixinsField<Mi extends Array<any>, F> =
 interface Context {
   triggerEvent: WechatMiniprogram.Component.InstanceMethods<Record<string, any>>['triggerEvent']
   refs: ObjectOf<WechatMiniprogram.NodesRef & ComponentIns<{}, {}, {}, {}, []>>
-
+  asyncRefs: ObjectOf<Promise<WechatMiniprogram.NodesRef & ComponentIns<{}, {}, {}, {}, []>>>
   forceUpdate (params?: object, callback?: () => void): void
-
   selectComponent: ReplaceWxComponentIns['selectComponent']
   selectAllComponents: ReplaceWxComponentIns['selectAllComponents']
   createSelectorQuery: WechatMiniprogram.Component.InstanceMethods<Record<string, any>>['createSelectorQuery']
@@ -194,29 +192,18 @@ export function observable<T extends object> (obj: T): T
 type MpxComProps<O> = { $rawOptions: O }
 
 export interface MpxComponentIns {
-
   $refs: ObjectOf<WechatMiniprogram.NodesRef & ComponentIns<{}, {}, {}, {}, []>>
-
+  $asyncRefs : ObjectOf<Promise<WechatMiniprogram.NodesRef & ComponentIns<{}, {}, {}, {}, []>>>
   $set: typeof set
-
   $remove: typeof del
-
   $delete: typeof del
-
   $watch (expr: string | (() => any), handler: WatchHandler | WatchOptWithHandler, options?: WatchOpt): () => void
-
   $forceUpdate (params?: object, callback?: () => void): void
-
   $nextTick (fn: () => void): void
-
   $t: typeof t
-
   $tc: typeof tc
-
   $te: typeof te
-
   $tm: typeof tm
-
   [k: string]: any
 }
 
@@ -516,11 +503,6 @@ export function reactive<T extends object> (target: T): Reactive<T>
 
 export function isReactive (value: unknown): boolean
 
-/**
- * Return a shallowly-reactive copy of the original object, where only the root
- * level properties are reactive. It also does not auto-unwrap refs (even at the
- * root level).
- */
 export function shallowReactive<T extends object> (target: T): ShallowReactive<T>
 
 export function computed<T> (
@@ -618,7 +600,7 @@ export function onTabItemTap (callback: () => void): void
 export function onSaveExitState (callback: () => void): void
 
 // get instance
-export function getCurrentInstance<T extends object> (): T
+export function getCurrentInstance<T extends MpxComponentIns> (): T
 
 // I18n
 export function useI18n<Options extends {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.8.0-beta.5",
+  "version": "2.8.1",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",
@@ -19,7 +19,7 @@
   ],
   "main": "src/index.js",
   "dependencies": {
-    "@mpxjs/utils": "^2.8.0-beta.4",
+    "@mpxjs/utils": "^2.8.1",
     "lodash": "^4.1.1",
     "miniprogram-api-typings": "^3.0.2"
   },
@@ -47,5 +47,5 @@
     "url": "https://github.com/didi/mpx/issues"
   },
   "sideEffects": false,
-  "gitHead": "4e1d6b16c406d3caac0dabb4fae9bc16ac330755"
+  "gitHead": "19f21ed57a671536eb1b2e059758118b026bab25"
 }

package/src/core/proxy.js

@@ -215,8 +215,6 @@ export default class MpxProxy {
       // 强制执行render
       this.target.$forceUpdate = this.forceUpdate.bind(this)
       this.target.$nextTick = nextTick
-      // 挂载$refs对象
-      this.target.$refs = {}
     }
   }
 
@@ -234,6 +232,7 @@ export default class MpxProxy {
         {
           triggerEvent: this.target.triggerEvent.bind(this.target),
           refs: this.target.$refs,
+          asyncRefs: this.target.$asyncRefs,
           forceUpdate: this.forceUpdate.bind(this),
           selectComponent: this.target.selectComponent.bind(this.target),
           selectAllComponents: this.target.selectAllComponents.bind(this.target),
@@ -482,10 +481,8 @@ export default class MpxProxy {
       this.forceUpdateAll = false
     }
 
-    /**
-     * mounted之后才接收回调来触发updated钩子，换言之mounted之前修改数据是不会触发updated的
-     */
     let callback = cb
+    // mounted之后才会触发BEFOREUPDATE/UPDATED
     if (this.isMounted()) {
       this.callHook(BEFOREUPDATE)
       callback = () => {
@@ -494,6 +491,7 @@ export default class MpxProxy {
         renderTask && renderTask.resolve()
       }
     }
+
     data = processUndefined(data)
     if (typeof Mpx.config.setDataHandler === 'function') {
       try {
@@ -501,6 +499,7 @@ export default class MpxProxy {
       } catch (e) {
       }
     }
+
     this.target.__render(data, callback)
   }
 

package/src/platform/builtInMixins/refsMixin.js

@@ -1,4 +1,4 @@
-import { CREATED, BEFOREMOUNT, BEFOREUPDATE, UNMOUNTED } from '../../core/innerLifecycle'
+import { CREATED, BEFORECREATE, BEFOREUPDATE, UNMOUNTED } from '../../core/innerLifecycle'
 import { noop, error } from '@mpxjs/utils'
 import { getEnvObj } from '@mpxjs/utils/src/env'
 
@@ -16,38 +16,42 @@ const setNodeRef = function (target, ref) {
 }
 
 const setComponentRef = function (target, ref, isAsync) {
-  let cacheRef = null
-  const targetRefs = isAsync ? (target.$asyncRefs || (target.$asyncRefs = {})) : target.$refs
-  Object.defineProperty(targetRefs, ref.key, {
+  const targetRefs = isAsync ? target.$asyncRefs : target.$refs
+  const cacheMap = isAsync ? target.__asyncRefCacheMap : target.__refCacheMap
+  const key = ref.key
+  Object.defineProperty(targetRefs, key, {
     enumerable: true,
     configurable: true,
     get () {
       // wx由于分包异步化的存在，每次访问refs都需要重新执行selectComponent，避免一直拿到缓存中的placeholder
-      if (__mpx_mode__ === 'wx' || !cacheRef) {
-        return (cacheRef = target.__getRefNode(ref, isAsync))
+      if (__mpx_mode__ === 'wx' || !cacheMap.get(key)) {
+        cacheMap.set(key, target.__getRefNode(ref, isAsync))
       }
-      return cacheRef
+      return cacheMap.get(key)
     }
   })
 }
 
 export default function getRefsMixin () {
   const refsMixin = {
-    [BEFOREMOUNT] () {
+    [BEFORECREATE] () {
+      this.$refs = {}
+      this.$asyncRefs = {}
+      this.__refCacheMap = new Map()
+      this.__asyncRefCacheMap = new Map()
       this.__getRefs()
     },
     [BEFOREUPDATE] () {
-      this.__getRefs()
+      this.__refCacheMap.clear()
+      this.__asyncRefCacheMap.clear()
     },
     methods: {
       __getRefs () {
         if (this.__getRefsData) {
           const refs = this.__getRefsData()
-
           refs.forEach(ref => {
             const setRef = ref.type === 'node' ? setNodeRef : setComponentRef
             setRef(this, ref)
-
             if (__mpx_mode__ === 'tt' && ref.type === 'component') {
               setComponentRef(this, ref, true)
             }
@@ -108,7 +112,7 @@ export default function getRefsMixin () {
         selectorQuery.exec = function (originalCb = noop) {
           const cb = function (results) {
             results.forEach((item, index) => {
-              cbs[index](item)
+              cbs[index] && cbs[index](item)
             })
             originalCb(results)
           }