@mpxjs/core 2.7.26 → 2.7.33

package/@types/index.d.ts

@@ -7,6 +7,8 @@
 /// <reference path="./mpx-store.d.ts" />
 /// <reference path="./global.d.ts" />
 /// <reference path="./node.d.ts" />
+
+// @ts-ignore
 import VueI18n from 'vue-i18n'
 
 declare module 'vue-i18n' {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.7.26",
+  "version": "2.7.33",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",
@@ -41,5 +41,5 @@
     "url": "https://github.com/didi/mpx/issues"
   },
   "sideEffects": false,
-  "gitHead": "bfad123d02a216278c122135148ba2a3977121d0"
+  "gitHead": "c1d2e39bcfef9bf20484dcbb301381b86a5939e6"
 }

package/src/core/proxy.js

@@ -41,13 +41,14 @@ export default class MPXProxy {
     this.uid = uid++
     this.name = options.name || ''
     this.options = options
-    // initial -> created -> mounted -> destroyed
-    this.state = 'initial'
+    // beforeCreate -> created -> mounted -> destroyed
+    this.state = BEFORECREATE
     this.lockTask = asyncLock()
     this.ignoreProxyMap = makeMap(EXPORT_MPX.config.ignoreProxyWhiteList)
     if (__mpx_mode__ !== 'web') {
       this._watchers = []
       this._namedWatchers = {}
+      this._computedWatchers = {}
       this._watcher = null
       this.localKeysMap = {} // 非props key
       this.renderData = {} // 渲染函数中收集的数据
@@ -62,16 +63,33 @@ export default class MPXProxy {
     this.initApi()
     this.callUserHook(BEFORECREATE)
     if (__mpx_mode__ !== 'web') {
-      this.initState(this.options)
+      this.initState()
     }
     this.state = CREATED
     this.callUserHook(CREATED, params)
     if (__mpx_mode__ !== 'web') {
-      // 强制走小程序原生渲染逻辑
-      this.options.__nativeRender__ ? this.doRender() : this.initRender()
+      this.initRender()
     }
   }
 
+  reCreated (params) {
+    const options = this.options
+    this.state = BEFORECREATE
+    this.callUserHook(BEFORECREATE)
+    if (__mpx_mode__ !== 'web') {
+      this.initComputed(options.computed, true)
+      this.initWatch(options.watch)
+    }
+    this.state = CREATED
+    this.callUserHook(CREATED, params)
+    if (__mpx_mode__ !== 'web') {
+      this.initRender()
+    }
+    this.nextTick(() => {
+      this.mounted()
+    })
+  }
+
   renderTaskExecutor (isEmptyRender) {
     if ((!this.isMounted() && this.curRenderTask) || (this.isMounted() && isEmptyRender)) {
       return
@@ -118,6 +136,10 @@ export default class MPXProxy {
     this.callUserHook(DESTROYED)
   }
 
+  isDestroyed () {
+    return this.state === DESTROYED
+  }
+
   initApi () {
     // 挂载扩展属性到实例上
     proxy(this.target, this.options.proto, Object.keys(this.options.proto), true, (key) => {
@@ -168,10 +190,15 @@ export default class MPXProxy {
     this.initWatch(options.watch)
   }
 
-  initComputed (computedOpt) {
+  initComputed (computedOpt, reInit) {
     if (computedOpt) {
-      this.collectLocalKeys(computedOpt)
-      initComputed(this, this.data, computedOpt)
+      if (reInit) {
+        // target传递null以跳过computed挂载，仅重新初始化watchers
+        initComputed(this, null, computedOpt)
+      } else {
+        this.collectLocalKeys(computedOpt)
+        initComputed(this, this.data, computedOpt)
+      }
     }
   }
 
@@ -194,7 +221,9 @@ export default class MPXProxy {
       })
       Object.assign(this.data, dataFn.call(this.target))
     }
+    // 此时data中不包括props数据
     this.collectLocalKeys(this.data)
+    // 将props数据合并到data中
     Object.keys(initialData).forEach((key) => {
       if (!hasOwn(this.data, key)) {
         // 除了data函数返回的数据外深拷贝切断引用关系，避免后续watch由于小程序内部对data赋值重复触发watch
@@ -263,6 +292,7 @@ export default class MPXProxy {
     while (i--) {
       this._watchers[i].teardown()
     }
+    this._watchers.length = 0
   }
 
   render () {
@@ -414,9 +444,10 @@ export default class MPXProxy {
   }
 
   initRender () {
-    let renderWatcher
+    if (this.options.__nativeRender__) return this.doRender()
+
     if (this.target.__injectedRender) {
-      renderWatcher = new Watcher(this, () => {
+      this._watcher = new Watcher(this, () => {
         try {
           return this.target.__injectedRender()
         } catch (e) {
@@ -425,11 +456,10 @@ export default class MPXProxy {
         }
       }, noop, { pausable: true })
     } else {
-      renderWatcher = new Watcher(this, () => {
+      this._watcher = new Watcher(this, () => {
         this.render()
       }, noop, { pausable: true })
     }
-    this._watcher = renderWatcher
   }
 
   forceUpdate (data, options, callback) {

package/src/observer/computed.js

@@ -20,10 +20,12 @@ export function initComputed (vm, target, computed) {
       noop,
       { lazy: true }
     )
-    if (!(key in target)) {
-      defineComputed(vm, target, key, userDef)
-    } else {
-      error(`The computed key [${key}] is duplicated with data/props, please check.`, vm.options.mpxFileResource)
+    if (target) {
+      if (!(key in target)) {
+        defineComputed(vm, target, key, userDef)
+      } else {
+        error(`The computed key [${key}] is duplicated with data/props, please check.`, vm.options.mpxFileResource)
+      }
     }
   }
 }

package/src/platform/builtInMixins/pageStatusMixin.js

@@ -35,7 +35,7 @@ export default function pageStatusMixin (mixinType) {
       [CREATED] () {
         const options = this.$rawOptions
         const hasPageShow = options.pageShow || options.pageHide
-        const needPageLifetimes = options.pageLifetimes && (__mpx_mode__ === 'ali' || __mpx_mode__ === 'tt')
+        const needPageLifetimes = options.pageLifetimes && __mpx_mode__ === 'ali'
 
         if (hasPageShow || needPageLifetimes) {
           let currentPage

package/src/platform/builtInMixins/refsMixin.js

@@ -22,7 +22,8 @@ const setComponentRef = function (target, ref, context, isAsync) {
     enumerable: true,
     configurable: true,
     get () {
-      if (!cacheRef) {
+      // wx由于分包异步化的存在，每次访问refs都需要重新执行selectComponen，避免一直拿到缓存中的placeholder
+      if (__mpx_mode__ === 'wx' || !cacheRef) {
         return (cacheRef = context.__getRefNode(ref, isAsync))
       }
       return cacheRef

package/src/platform/patch/ali/getDefaultOptions.js

@@ -84,23 +84,24 @@ function filterOptions (options, type) {
 }
 
 function initProxy (context, rawOptions, currentInject, params) {
-  // 提供代理对象需要的api
-  transformApiForProxy(context, currentInject)
-  // 缓存options
-  context.$rawOptions = rawOptions
-  // 创建proxy对象
-  const mpxProxy = new MPXProxy(rawOptions, context)
-  context.__mpxProxy = mpxProxy
-  context.__mpxProxy.created(params)
+  if (!context.__mpxProxy) {
+    // 提供代理对象需要的api
+    transformApiForProxy(context, currentInject)
+    // 缓存options
+    context.$rawOptions = rawOptions
+    // 创建proxy对象
+    context.__mpxProxy = new MPXProxy(rawOptions, context)
+    context.__mpxProxy.created(params)
+  } else if (context.__mpxProxy.isDestroyed()) {
+    context.__mpxProxy.reCreated(params)
+  }
 }
 
 export function getDefaultOptions (type, { rawOptions = {}, currentInject }) {
   const hookNames = type === 'component' ? ['onInit', 'didMount', 'didUnmount'] : ['onLoad', 'onReady', 'onUnload']
   const rootMixins = [{
     [hookNames[0]] (...params) {
-      if (!this.__mpxProxy) {
-        initProxy(this, rawOptions, currentInject, params)
-      }
+      initProxy(this, rawOptions, currentInject, params)
     },
     deriveDataFromProps (nextProps) {
       if (this.__mpxProxy && this.__mpxProxy.isMounted() && nextProps && nextProps !== this.props) {
@@ -130,6 +131,7 @@ export function getDefaultOptions (type, { rawOptions = {}, currentInject }) {
     },
     didUpdate () {
       if (this.__mpxProxy) {
+        // todo: lockTask必要性待验证，属性更新触发自身setData时，updated执行与wx对齐，updated触发机制也考虑与wx对齐（props update && setData callback）
         this.__mpxProxy.lockTask(() => {
           this.__mpxProxy.updated()
         })
@@ -143,7 +145,7 @@ export function getDefaultOptions (type, { rawOptions = {}, currentInject }) {
       }
     },
     [hookNames[2]] () {
-      this.__mpxProxy && this.__mpxProxy.destroyed()
+      if (this.__mpxProxy) this.__mpxProxy.destroyed()
     }
   }]
   rawOptions.mixins = rawOptions.mixins ? rootMixins.concat(rawOptions.mixins) : rootMixins

package/src/platform/patch/swan/getDefaultOptions.js

@@ -10,24 +10,20 @@ export function getDefaultOptions (type, { rawOptions = {}, currentInject }) {
 
   const rootMixin = {
     [hookNames[0]] (...params) {
-      if (!this.__mpxProxy) {
-        initProxy(this, rawOptions, currentInject, params)
-      }
+      initProxy(this, rawOptions, currentInject, params)
     },
     [hookNames[1]] () {
-      this.__mpxProxy && this.__mpxProxy.mounted()
+      if (this.__mpxProxy) this.__mpxProxy.mounted()
     },
     [hookNames[2]] () {
-      this.__mpxProxy && this.__mpxProxy.destroyed()
+      if (this.__mpxProxy) this.__mpxProxy.destroyed()
     }
   }
 
   // 如构造页面，优先使用onInit进行初始化
   if (type === 'page') {
     rootMixin.onInit = function (...params) {
-      if (!this.__mpxProxy) {
-        initProxy(this, rawOptions, currentInject, params)
-      }
+      initProxy(this, rawOptions, currentInject, params)
     }
   }
 

package/src/platform/patch/web/getDefaultOptions.js

@@ -24,31 +24,33 @@ function filterOptions (options) {
 }
 
 function initProxy (context, rawOptions, params) {
-  // 缓存options
-  context.$rawOptions = rawOptions
-  // 创建proxy对象
-  const mpxProxy = new MPXProxy(rawOptions, context)
-  context.__mpxProxy = mpxProxy
-  context.__mpxProxy.created(params)
+  if (!context.__mpxProxy) {
+    // 缓存options
+    context.$rawOptions = rawOptions
+    // 创建proxy对象
+    context.__mpxProxy = new MPXProxy(rawOptions, context)
+    context.__mpxProxy.created(params)
+  } else if (context.__mpxProxy.isDestroyed()) {
+    context.__mpxProxy.reCreated(params)
+  }
 }
 
 export function getDefaultOptions (type, { rawOptions = {} }) {
   const rootMixins = [{
     created () {
-      if (!this.__mpxProxy) {
-        const query = (global.__mpxRouter && global.__mpxRouter.currentRoute && global.__mpxRouter.currentRoute.query) || {}
-        initProxy(this, rawOptions, [query])
-        this.onLoad && this.onLoad(query)
-      }
+      const query = (global.__mpxRouter && global.__mpxRouter.currentRoute && global.__mpxRouter.currentRoute.query) || {}
+      initProxy(this, rawOptions, [query])
+      // web中单独触发onLoad
+      this.onLoad && this.onLoad(query)
     },
     mounted () {
-      this.__mpxProxy && this.__mpxProxy.mounted()
+      if (this.__mpxProxy) this.__mpxProxy.mounted()
     },
     updated () {
-      this.__mpxProxy && this.__mpxProxy.updated()
+      if (this.__mpxProxy) this.__mpxProxy.updated()
     },
     destroyed () {
-      this.__mpxProxy && this.__mpxProxy.destroyed()
+      if (this.__mpxProxy) this.__mpxProxy.destroyed()
     }
   }]
   // 为了在builtMixin中可以使用某些rootMixin实现的特性（如数据响应等），此处builtInMixin在rootMixin之后执行，但是当builtInMixin使用存在对应内建生命周期的目标平台声明周期写法时，可能会出现用户生命周期比builtInMixin中的生命周期先执行的情况，为了避免这种情况发生，builtInMixin应该尽可能使用内建生命周期来编写

package/src/platform/patch/wx/getDefaultOptions.js

@@ -117,14 +117,17 @@ export function filterOptions (options) {
 }
 
 export function initProxy (context, rawOptions, currentInject, params) {
-  // 提供代理对象需要的api
-  transformApiForProxy(context, currentInject)
-  // 缓存options
-  context.$rawOptions = rawOptions
-  // 创建proxy对象
-  const mpxProxy = new MPXProxy(rawOptions, context)
-  context.__mpxProxy = mpxProxy
-  context.__mpxProxy.created(params)
+  if (!context.__mpxProxy) {
+    // 提供代理对象需要的api
+    transformApiForProxy(context, currentInject)
+    // 缓存options
+    context.$rawOptions = rawOptions
+    // 创建proxy对象
+    context.__mpxProxy = new MPXProxy(rawOptions, context)
+    context.__mpxProxy.created(params)
+  } else if (context.__mpxProxy.isDestroyed()) {
+    context.__mpxProxy.reCreated(params)
+  }
 }
 
 export function getDefaultOptions (type, { rawOptions = {}, currentInject }) {
@@ -135,15 +138,13 @@ export function getDefaultOptions (type, { rawOptions = {}, currentInject }) {
   }
   const rootMixins = [{
     [hookNames[0]] (...params) {
-      if (!this.__mpxProxy) {
-        initProxy(this, rawOptions, currentInject, params)
-      }
+      initProxy(this, rawOptions, currentInject, params)
     },
     [hookNames[1]] () {
-      this.__mpxProxy && this.__mpxProxy.mounted()
+      if (this.__mpxProxy) this.__mpxProxy.mounted()
     },
     [hookNames[2]] () {
-      this.__mpxProxy && this.__mpxProxy.destroyed()
+      if (this.__mpxProxy) this.__mpxProxy.destroyed()
     }
   }]
   rawOptions.mixins = rawOptions.mixins ? rootMixins.concat(rawOptions.mixins) : rootMixins