@mpxjs/core 2.9.67 → 2.9.69-beta.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.9.67",
+  "version": "2.9.69-beta.1",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",
@@ -19,21 +19,24 @@
   ],
   "main": "src/index.js",
   "dependencies": {
-    "@mpxjs/utils": "^2.9.67",
+    "@mpxjs/utils": "^2.9.69-beta.0",
     "lodash": "^4.1.1",
     "miniprogram-api-typings": "^3.10.0"
   },
   "peerDependencies": {
     "@ant-design/react-native": "^5.1.3",
+    "@d11/react-native-fast-image": "^8.6.12",
     "@mpxjs/api-proxy": "^2.9.0",
     "@mpxjs/store": "^2.9.0",
-    "@react-navigation/native": "^6.1.17",
-    "@react-navigation/native-stack": "^6.9.26",
+    "@react-navigation/native": "^7.0.3",
+    "@react-navigation/stack": "^7.0.4",
     "react": "*",
     "react-native": "*",
+    "promise": "^8.3.0",
     "react-native-gesture-handler": "^2.19.0",
     "react-native-linear-gradient": "^2.8.3",
-    "react-native-safe-area-context": "^4.10.1",
+    "react-native-safe-area-context": "^4.14.0",
+    "react-native-screens": "^4.1.0",
     "react-native-webview": "^13.10.5",
     "vue": "^2.7.10",
     "vue-demi": "^0.14.6",
@@ -59,10 +62,13 @@
     "react-native": {
       "optional": true
     },
+    "promise": {
+      "optional": true
+    },
     "@react-navigation/native": {
       "optional": true
     },
-    "@react-navigation/native-stack": {
+    "@react-navigation/stack": {
       "optional": true
     },
     "@ant-design/react-native": {
@@ -71,6 +77,9 @@
     "react-native-safe-area-context": {
       "optional": true
     },
+    "react-native-screens": {
+      "optional": true
+    },
     "react-native-webview": {
       "optional": true
     },
@@ -79,6 +88,9 @@
     },
     "react-native-linear-gradient": {
       "optional": true
+    },
+    "@d11/react-native-fast-image": {
+      "optional": true
     }
   },
   "publishConfig": {
@@ -97,5 +109,5 @@
     "url": "https://github.com/didi/mpx/issues"
   },
   "sideEffects": false,
-  "gitHead": "b23d3850c16543c5998811b8d1d8e6ee7988c0f8"
+  "gitHead": "2d37697869b9bdda3efab92dda8c910b68fd05c0"
 }

package/src/convertor/convertor.js

@@ -1,9 +1,6 @@
-import * as wxLifecycle from '../platform/patch/wx/lifecycle'
-import * as aliLifecycle from '../platform/patch/ali/lifecycle'
-import * as webLifecycle from '../platform/patch/web/lifecycle'
-import * as swanLifecycle from '../platform/patch/swan/lifecycle'
+import { LIFECYCLE, lifecycleProxyMap, pageMode } from '../platform/patch/lifecycle/index'
 import { mergeLifecycle } from './mergeLifecycle'
-import { error } from '@mpxjs/utils'
+import { error, extend } from '@mpxjs/utils'
 import wxToAliRule from './wxToAli'
 import wxToWebRule from './wxToWeb'
 import wxToSwanRule from './wxToSwan'
@@ -13,24 +10,6 @@ import wxToDdRule from './wxToDd'
 import wxToJdRule from './wxToJd'
 import wxToReactRule from './wxToReact'
 
-// 根据当前环境获取的默认生命周期信息
-let lifecycleInfo
-let pageMode
-
-if (__mpx_mode__ === 'web') {
-  lifecycleInfo = webLifecycle
-  pageMode = ''
-} else if (__mpx_mode__ === 'ali') {
-  lifecycleInfo = aliLifecycle
-  pageMode = ''
-} else if (__mpx_mode__ === 'swan') {
-  lifecycleInfo = swanLifecycle
-  pageMode = 'blend'
-} else {
-  lifecycleInfo = wxLifecycle
-  pageMode = 'blend'
-}
-
 /**
  * 转换规则包含四点
  * lifecycle [object] 生命周期
@@ -40,25 +19,25 @@ if (__mpx_mode__ === 'web') {
  * convert [function] 自定义转换函数, 接收一个options
  */
 const defaultConvertRule = {
-  lifecycle: mergeLifecycle(lifecycleInfo.LIFECYCLE),
-  lifecycleProxyMap: lifecycleInfo.lifecycleProxyMap,
+  lifecycle: mergeLifecycle(LIFECYCLE),
+  lifecycleProxyMap: lifecycleProxyMap,
   pageMode,
   support: !!pageMode,
   convert: null
 }
 
 const rulesMap = {
-  local: { ...defaultConvertRule },
+  local: extend({}, defaultConvertRule),
   default: defaultConvertRule,
   wxToWeb: wxToWebRule,
   wxToAli: wxToAliRule,
   wxToSwan: wxToSwanRule,
-  wxToQq: { ...defaultConvertRule, ...wxToQqRule },
-  wxToTt: { ...defaultConvertRule, ...wxToTtRule },
-  wxToDd: { ...defaultConvertRule, ...wxToDdRule },
-  wxToJd: { ...defaultConvertRule, ...wxToJdRule },
-  wxToIos: { ...defaultConvertRule, ...wxToReactRule },
-  wxToAndroid: { ...defaultConvertRule, ...wxToReactRule }
+  wxToQq: extend({}, defaultConvertRule, wxToQqRule),
+  wxToTt: extend({}, defaultConvertRule, wxToTtRule),
+  wxToDd: extend({}, defaultConvertRule, wxToDdRule),
+  wxToJd: extend({}, defaultConvertRule, wxToJdRule),
+  wxToIos: extend({}, defaultConvertRule, wxToReactRule),
+  wxToAndroid: extend({}, defaultConvertRule, wxToReactRule)
 }
 
 export function getConvertRule (convertMode) {

package/src/convertor/wxToAli.js

@@ -1,5 +1,5 @@
-import * as wxLifecycle from '../platform/patch/wx/lifecycle'
-import * as aliLifecycle from '../platform/patch/ali/lifecycle'
+import * as wxLifecycle from '../platform/patch/lifecycle/index.wx'
+import { LIFECYCLE } from '../platform/patch/lifecycle/index'
 import { mergeLifecycle } from './mergeLifecycle'
 import { error, hasOwn, isDev } from '@mpxjs/utils'
 import { implemented } from '../core/implement'
@@ -38,7 +38,7 @@ function notSupportTip (options) {
 
 export default {
   lifecycle: mergeLifecycle(wxLifecycle.LIFECYCLE),
-  lifecycle2: mergeLifecycle(aliLifecycle.LIFECYCLE),
+  lifecycle2: mergeLifecycle(LIFECYCLE),
   pageMode: 'blend',
   support: false,
   lifecycleProxyMap: wxLifecycle.lifecycleProxyMap,

package/src/convertor/wxToReact.js

@@ -5,7 +5,7 @@ import {
 import { implemented } from '../core/implement'
 
 // 暂不支持的wx选项，后期需要各种花式支持
-const unsupported = ['relations', 'moved', 'definitionFilter', 'onShareAppMessage']
+const unsupported = ['relations', 'moved', 'definitionFilter']
 
 function convertErrorDesc (key) {
   error(`Options.${key} is not supported in runtime conversion from wx to react native.`, global.currentResource)

package/src/convertor/wxToSwan.js

@@ -1,8 +1,8 @@
 import { error, isDev } from '@mpxjs/utils'
 import { implemented } from '../core/implement'
 import { mergeLifecycle } from './mergeLifecycle'
-import * as wxLifecycle from '../platform/patch/wx/lifecycle'
-import * as swanLifecycle from '../platform/patch/swan/lifecycle'
+import * as wxLifecycle from '../platform/patch/lifecycle/index.wx'
+import { LIFECYCLE } from '../platform/patch/lifecycle/index'
 
 const BEHAVIORS_MAP = {
   'wx://form-field': 'swan://form-field',
@@ -30,7 +30,7 @@ function notSupportTip (options) {
 
 export default {
   lifecycle: mergeLifecycle(wxLifecycle.LIFECYCLE),
-  lifecycle2: mergeLifecycle(swanLifecycle.LIFECYCLE),
+  lifecycle2: mergeLifecycle(LIFECYCLE),
   pageMode: 'blend',
   support: true,
   lifecycleProxyMap: wxLifecycle.lifecycleProxyMap,

package/src/convertor/wxToWeb.js

@@ -1,5 +1,5 @@
-import * as wxLifecycle from '../platform/patch/wx/lifecycle'
-import * as webLifecycle from '../platform/patch/web/lifecycle'
+import * as wxLifecycle from '../platform/patch/lifecycle/index.wx'
+import { LIFECYCLE } from '../platform/patch/lifecycle/index'
 import { mergeLifecycle } from './mergeLifecycle'
 import {
   isObject,
@@ -32,7 +32,7 @@ function notSupportTip (options) {
 
 export default {
   lifecycle: mergeLifecycle(wxLifecycle.LIFECYCLE),
-  lifecycle2: mergeLifecycle(webLifecycle.LIFECYCLE),
+  lifecycle2: mergeLifecycle(LIFECYCLE),
   pageMode: 'blend',
   support: true,
   lifecycleProxyMap: wxLifecycle.lifecycleProxyMap,

package/src/core/proxy.js

@@ -14,6 +14,7 @@ import {
   isEmptyObject,
   isPlainObject,
   isWeb,
+  isReact,
   doGetByPath,
   getByPath,
   setByPath,
@@ -50,7 +51,7 @@ import {
 } from './innerLifecycle'
 import contextMap from '../dynamic/vnode/context'
 import { getAst } from '../dynamic/astCache'
-import { inject, provide } from '../platform/export/apiInject'
+import { inject, provide } from '../platform/export/inject'
 
 let uid = 0
 
@@ -116,7 +117,7 @@ export default class MpxProxy {
     this.ignoreProxyMap = makeMap(Mpx.config.ignoreProxyWhiteList)
     // 收集setup中动态注册的hooks，小程序与web环境都需要
     this.hooks = {}
-    if (__mpx_mode__ !== 'web') {
+    if (!isWeb) {
       this.scope = effectScope(true)
       // props响应式数据代理
       this.props = {}
@@ -134,8 +135,12 @@ export default class MpxProxy {
       this.forceUpdateAll = false
       this.currentRenderTask = null
       this.propsUpdatedFlag = false
-      // react专用，正确触发updated钩子
-      this.pendingUpdatedFlag = false
+      if (isReact) {
+        // react专用，正确触发updated钩子
+        this.pendingUpdatedFlag = false
+        this.memoVersion = Symbol()
+        this.finalMemoVersion = Symbol()
+      }
     }
     this.initApi()
   }
@@ -160,7 +165,7 @@ export default class MpxProxy {
       // 缓存上下文，在 destoryed 阶段删除
       contextMap.set(this.uid, this.target)
     }
-    if (__mpx_mode__ !== 'web') {
+    if (!isWeb) {
       // web中BEFORECREATE钩子通过vue的beforeCreate钩子单独驱动
       this.callHook(BEFORECREATE)
       setCurrentInstance(this)
@@ -179,7 +184,7 @@ export default class MpxProxy {
     this.state = CREATED
     this.callHook(CREATED)
 
-    if (__mpx_mode__ !== 'web' && __mpx_mode__ !== 'ios' && __mpx_mode__ !== 'android') {
+    if (!isWeb && !isReact) {
       this.initRender()
     }
 
@@ -272,7 +277,7 @@ export default class MpxProxy {
     }
     // 挂载$rawOptions
     this.target.$rawOptions = this.options
-    if (__mpx_mode__ !== 'web') {
+    if (!isWeb) {
       // 挂载$watch
       this.target.$watch = this.watch.bind(this)
       // 强制执行render
@@ -282,13 +287,14 @@ export default class MpxProxy {
   }
 
   initProps () {
-    if (__mpx_mode__ === 'ios' || __mpx_mode__ === 'android') {
+    if (isReact) {
       // react模式下props内部对象透传无需深clone，依赖对象深层的数据响应触发子组件更新
       this.props = this.target.__getProps()
+      reactive(this.processIgnoreReactive(this.props))
     } else {
       this.props = diffAndCloneA(this.target.__getProps(this.options)).clone
+      reactive(this.processIgnoreReactive(this.props))
     }
-    reactive(this.processIgnoreReactive(this.props))
     proxy(this.target, this.props, undefined, false, this.createProxyConflictHandler('props'))
   }
 
@@ -562,7 +568,7 @@ export default class MpxProxy {
           }
           if (!processed) {
             // 如果当前数据和上次的miniRenderData完全无关，但存在于组件的视图数据中，则与组件视图数据进行diff
-            if (this.target.data && hasOwn(this.target.data, firstKey)) {
+            if (hasOwn(this.target.data, firstKey)) {
               const localInitialData = getByPath(this.target.data, key)
               const { clone, diff, diffData } = diffAndCloneA(data, localInitialData)
               this.miniRenderData[key] = clone
@@ -755,12 +761,12 @@ export default class MpxProxy {
         }
         setByPath(this.target, key, data[key])
       })
-      this.forceUpdateData = data
+      Object.assign(this.forceUpdateData, data)
     } else {
       this.forceUpdateAll = true
     }
 
-    if (__mpx_mode__ === 'ios' || __mpx_mode__ === 'android') {
+    if (isReact) {
       // rn中不需要setdata
       this.forceUpdateData = {}
       this.forceUpdateAll = false

package/src/dynamic/dynamicRenderMixin.js

@@ -1,4 +1,4 @@
-import { hasOwn, isObject, error } from '@mpxjs/utils'
+import { hasOwn, error } from '@mpxjs/utils'
 import genVnodeTree from './vnode/render'
 import contextMap from './vnode/context'
 import { CREATED } from '../core/innerLifecycle'
@@ -56,7 +56,7 @@ function dynamicRenderHelperMixin () {
     methods: {
       _g (astData, moduleId) {
         const location = this.__mpxProxy && this.__mpxProxy.options.mpxFileResource
-        if (astData && isObject(astData) && hasOwn(astData, 'template')) {
+        if (hasOwn(astData, 'template')) {
           const vnodeTree = genVnodeTree(astData, [this], { moduleId, location })
           return vnodeTree
         } else {

package/src/index.js

@@ -1,8 +1,7 @@
-import Vue from './external/vue'
+
 import { error, diffAndCloneA, hasOwn, makeMap } from '@mpxjs/utils'
 import { APIs, InstanceAPIs } from './platform/export/api'
-
-import { createI18n } from './platform/builtInMixins/i18nMixin'
+import { init } from './platform/env/index'
 
 export * from './platform/export/index'
 
@@ -123,10 +122,6 @@ function factory () {
 
   Object.assign(Mpx, APIs)
   Object.assign(Mpx.prototype, InstanceAPIs)
-  // 输出web时在mpx上挂载Vue对象
-  if (__mpx_mode__ === 'web') {
-    Mpx.__vue = Vue
-  }
   return Mpx
 }
 
@@ -156,12 +151,6 @@ Mpx.config = {
   rnConfig: {}
 }
 
-global.__mpx = Mpx
-
-if (__mpx_mode__ !== 'web') {
-  if (global.i18n) {
-    Mpx.i18n = createI18n(global.i18n)
-  }
-}
+init(Mpx)
 
 export default Mpx

package/src/observer/reactive.js

@@ -34,6 +34,7 @@ export class Observer {
 
   constructor (value, shallow) {
     this.value = value
+    this.shallow = shallow
     def(value, ObKey, this)
     if (Array.isArray(value)) {
       const augment = hasProto && arrayProtoAugment
@@ -120,7 +121,7 @@ export function defineReactive (obj, key, val, shallow) {
   const getter = property && property.get
   const setter = property && property.set
 
-  let childOb = !shallow && observe(val)
+  let childOb = shallow ? getObserver(val) : observe(val)
   Object.defineProperty(obj, key, {
     enumerable: true,
     configurable: true,
@@ -149,7 +150,7 @@ export function defineReactive (obj, key, val, shallow) {
       } else {
         val = newVal
       }
-      childOb = !shallow && observe(newVal)
+      childOb = shallow ? getObserver(newVal) : observe(newVal)
       dep.notify()
     }
   })
@@ -175,7 +176,7 @@ export function set (target, key, val) {
     target[key] = val
     return val
   }
-  defineReactive(ob.value, key, val)
+  defineReactive(ob.value, key, val, ob.shallow)
   ob.dep.notify()
   return val
 }
@@ -225,7 +226,7 @@ export function shallowReactive (value) {
 }
 
 export function isReactive (value) {
-  return value && hasOwn(value, ObKey) && value[ObKey] instanceof Observer
+  return hasOwn(value, ObKey) && value[ObKey] instanceof Observer
 }
 
 export function getObserver (value) {

package/src/observer/ref.js

@@ -3,12 +3,13 @@ import { RefKey } from '../helper/const'
 import {
   warn,
   isPlainObject,
-  hasOwn
+  hasOwn,
+  extend
 } from '@mpxjs/utils'
 
 export class RefImpl {
   constructor (options) {
-    Object.defineProperty(this, 'value', { enumerable: true, ...options })
+    Object.defineProperty(this, 'value', extend({ enumerable: true }, options))
   }
 }
 

package/src/observer/scheduler.js

@@ -83,6 +83,10 @@ export function queueJob (job) {
   }
 }
 
+export function hasPendingJob (job) {
+  return queue.length && queue.includes(job, isFlushing && job.allowRecurse ? flushIndex + 1 : flushIndex)
+}
+
 function queueFlush () {
   if (!isFlushing && !isFlushPending) {
     isFlushPending = true

package/src/observer/watch.js

@@ -12,7 +12,8 @@ import {
   isArray,
   remove,
   callWithErrorHandling,
-  hasChanged
+  hasChanged,
+  extend
 } from '@mpxjs/utils'
 
 export function watchEffect (effect, options) {
@@ -20,11 +21,11 @@ export function watchEffect (effect, options) {
 }
 
 export function watchPostEffect (effect, options) {
-  return watch(effect, null, { ...options, flush: 'post' })
+  return watch(effect, null, extend({}, options, { flush: 'post' }))
 }
 
 export function watchSyncEffect (effect, options) {
-  return watch(effect, null, { ...options, flush: 'sync' })
+  return watch(effect, null, extend({}, options, { flush: 'sync' }))
 }
 
 const warnInvalidSource = (s) => {
@@ -34,7 +35,7 @@ const warnInvalidSource = (s) => {
 const shouldTrigger = (value, oldValue) => hasChanged(value, oldValue) || isObject(value)
 
 const processWatchOptionsCompat = (options) => {
-  const newOptions = { ...options }
+  const newOptions = extend({}, options)
   if (options.sync) {
     newOptions.flush = 'sync'
   }

package/src/platform/builtInMixins/directiveHelperMixin.ios.js

@@ -1,7 +1,10 @@
 export default function directiveHelperMixin () {
   return {
     methods: {
-      __getWxKey (item, key) {
+      __getWxKey (item, key, index) {
+        if (key === 'index') {
+          return index
+        }
         return key === '*this' ? item : item[key]
       }
     }

package/src/platform/builtInMixins/styleHelperMixin.ios.js

@@ -1,19 +1,22 @@
-import { isObject, isArray, dash2hump, isFunction, cached, getFocusedNavigation } from '@mpxjs/utils'
+import { isObject, isArray, dash2hump, cached, isEmptyObject } from '@mpxjs/utils'
 import { Dimensions, StyleSheet } from 'react-native'
 
+let { width, height } = Dimensions.get('screen')
+
+Dimensions.addEventListener('change', ({ screen }) => {
+  width = screen.width
+  height = screen.height
+})
+
 function rpx (value) {
-  const { width } = Dimensions.get('screen')
   // rn 单位 dp = 1(css)px =  1 物理像素 * pixelRatio(像素比)
   // px = rpx * (750 / 屏幕宽度)
   return value * width / 750
 }
 function vw (value) {
-  const { width } = Dimensions.get('screen')
   return value * width / 100
 }
 function vh (value) {
-  const navigation = getFocusedNavigation()
-  const height = navigation?.layout?.height || Dimensions.get('screen').height
   return value * height / 100
 }
 
@@ -23,15 +26,18 @@ const unit = {
   vh
 }
 
+const empty = {}
+
 function formatValue (value) {
-  let matched
-  if ((matched = numberRegExp.exec(value))) {
-    value = +matched[1]
-  } else if ((matched = unitRegExp.exec(value))) {
-    value = unit[matched[2]](+matched[1])
-  } else if (hairlineRegExp.test(value)) {
-    value = StyleSheet.hairlineWidth
+  const matched = unitRegExp.exec(value)
+  if (matched) {
+    if (!matched[2] || matched[2] === 'px') {
+      return +matched[1]
+    } else {
+      return unit[matched[2]](+matched[1])
+    }
   }
+  if (hairlineRegExp.test(value)) return StyleSheet.hairlineWidth
   return value
 }
 
@@ -106,8 +112,7 @@ function stringifyDynamicClass (value) {
 
 const listDelimiter = /;(?![^(]*[)])/g
 const propertyDelimiter = /:(.+)/
-const unitRegExp = /^\s*(-?\d+(?:\.\d+)?)(rpx|vw|vh)\s*$/
-const numberRegExp = /^\s*(-?\d+(\.\d+)?)(px)?\s*$/
+const unitRegExp = /^\s*(-?\d+(?:\.\d+)?)(rpx|vw|vh|px)?\s*$/
 const hairlineRegExp = /^\s*hairlineWidth\s*$/
 const varRegExp = /^--/
 
@@ -164,14 +169,8 @@ export default function styleHelperMixin () {
       },
       __getStyle (staticClass, dynamicClass, staticStyle, dynamicStyle, hide) {
         const result = {}
-        const classMap = {}
-        // todo 全局样式在每个页面和组件中生效，以支持全局原子类，后续支持样式模块复用后可考虑移除
-        if (isFunction(global.__getAppClassMap)) {
-          Object.assign(classMap, global.__getAppClassMap())
-        }
-        if (isFunction(this.__getClassMap)) {
-          Object.assign(classMap, this.__getClassMap())
-        }
+        const classMap = this.__getClassMap?.() || {}
+        const appClassMap = global.__getAppClassMap?.() || {}
 
         if (staticClass || dynamicClass) {
           // todo 当前为了复用小程序unocss产物，暂时进行mpEscape，等后续正式支持unocss后可不进行mpEscape
@@ -179,9 +178,12 @@ export default function styleHelperMixin () {
           classString.split(/\s+/).forEach((className) => {
             if (classMap[className]) {
               Object.assign(result, classMap[className])
-            } else if (this.props[className] && isObject(this.props[className])) {
+            } else if (appClassMap[className]) {
+              // todo 全局样式在每个页面和组件中生效，以支持全局原子类，后续支持样式模块复用后可考虑移除
+              Object.assign(result, appClassMap[className])
+            } else if (this.__props[className] && isObject(this.__props[className])) {
               // externalClasses必定以对象形式传递下来
-              Object.assign(result, this.props[className])
+              Object.assign(result, this.__props[className])
             }
           })
         }
@@ -196,7 +198,8 @@ export default function styleHelperMixin () {
             display: 'none'
           })
         }
-        return result
+
+        return isEmptyObject(result) ? empty : result
       }
     }
   }