@mpxjs/core 2.9.69-beta.5 → 2.9.69-beta.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.9.69-beta.5",
+  "version": "2.9.69-beta.8",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",

package/src/core/mergeOptions.js

@@ -122,9 +122,10 @@ function extractObservers (options) {
   Object.keys(props).forEach(key => {
     const prop = props[key]
     if (prop && prop.observer) {
+      let callback = prop.observer
+      delete prop.observer
       mergeWatch(key, {
         handler (...rest) {
-          let callback = prop.observer
           if (typeof callback === 'string') {
             callback = this[callback]
           }

package/src/core/proxy.js

@@ -1,4 +1,4 @@
-import { reactive } from '../observer/reactive'
+import { reactive, defineReactive } from '../observer/reactive'
 import { ReactiveEffect, pauseTracking, resetTracking } from '../observer/effect'
 import { effectScope } from '../platform/export/index'
 import { watch } from '../observer/watch'
@@ -111,7 +111,7 @@ export default class MpxProxy {
     this.uid = uid++
     this.name = options.name || ''
     this.options = options
-    this.ignoreReactivePattern = this.options.options?.ignoreReactivePattern
+    this.shallowReactivePattern = this.options.options?.shallowReactivePattern
     // beforeCreate -> created -> mounted -> unmounted
     this.state = BEFORECREATE
     this.ignoreProxyMap = makeMap(Mpx.config.ignoreProxyWhiteList)
@@ -145,10 +145,12 @@ export default class MpxProxy {
     this.initApi()
   }
 
-  processIgnoreReactive (obj) {
-    if (this.ignoreReactivePattern && isObject(obj)) {
+  processShallowReactive (obj) {
+    if (this.shallowReactivePattern && isObject(obj)) {
       Object.keys(obj).forEach((key) => {
-        if (this.ignoreReactivePattern.test(key)) {
+        if (this.shallowReactivePattern.test(key)) {
+          // 命中shallowReactivePattern的属性将其设置为 shallowReactive
+          defineReactive(obj, key, obj[key], true)
           Object.defineProperty(obj, key, {
             enumerable: true,
             // set configurable to false to skip defineReactive
@@ -290,10 +292,10 @@ export default class MpxProxy {
     if (isReact) {
       // react模式下props内部对象透传无需深clone，依赖对象深层的数据响应触发子组件更新
       this.props = this.target.__getProps()
-      reactive(this.processIgnoreReactive(this.props))
+      reactive(this.processShallowReactive(this.props))
     } else {
       this.props = diffAndCloneA(this.target.__getProps(this.options)).clone
-      reactive(this.processIgnoreReactive(this.props))
+      reactive(this.processShallowReactive(this.props))
     }
     proxy(this.target, this.props, undefined, false, this.createProxyConflictHandler('props'))
   }
@@ -333,7 +335,7 @@ export default class MpxProxy {
     if (isFunction(dataFn)) {
       Object.assign(this.data, callWithErrorHandling(dataFn.bind(this.target), this, 'data function'))
     }
-    reactive(this.processIgnoreReactive(this.data))
+    reactive(this.processShallowReactive(this.data))
     proxy(this.target, this.data, undefined, false, this.createProxyConflictHandler('data'))
     this.collectLocalKeys(this.data)
   }
@@ -514,7 +516,7 @@ export default class MpxProxy {
       if (hasOwn(renderData, key)) {
         const data = renderData[key]
         const firstKey = getFirstKey(key)
-        if (!this.localKeysMap[firstKey] || (this.ignoreReactivePattern && this.ignoreReactivePattern.test(firstKey))) {
+        if (!this.localKeysMap[firstKey]) {
           continue
         }
         // 外部clone，用于只需要clone的场景

package/src/platform/createApp.ios.js

@@ -178,18 +178,23 @@ export default function createApp (options) {
 
     const { initialRouteName, initialParams } = initialRouteRef.current
     const headerBackImageProps = Mpx.config.rnConfig.headerBackImageProps || null
+    const headerBackImageSource = Mpx.config.rnConfig.headerBackImageSource || null
     const navScreenOpts = {
       // 7.x替换headerBackTitleVisible
       // headerBackButtonDisplayMode: 'minimal',
       headerBackTitleVisible: false,
       // 安卓上会出现初始化时闪现导航条的问题
-      headerShown: false
+      headerShown: false,
+      headerShadowVisible: false
     }
     if (headerBackImageProps) {
       navScreenOpts.headerBackImage = () => {
         return createElement(Image, headerBackImageProps)
       }
     }
+    if (headerBackImageSource) {
+      navScreenOpts.headerBackImageSource = headerBackImageSource
+    }
     return createElement(SafeAreaProvider,
       null,
       createElement(NavigationContainer,

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

@@ -491,7 +491,7 @@ export function getDefaultOptions ({ type, rawOptions = {}, currentInject }) {
   }
 
   if (type === 'page') {
-    const { Provider, useSafeAreaInsets, GestureHandlerRootView } = global.__navigationHelper
+    const { Provider, useSafeAreaInsets, GestureHandlerRootView, useHeaderHeight } = global.__navigationHelper
     const pageConfig = Object.assign({}, global.__mpxPageConfig, currentInject.pageConfig)
     const Page = ({ navigation, route }) => {
       const [enabled, setEnabled] = useState(false)
@@ -530,17 +530,13 @@ export function getDefaultOptions ({ type, rawOptions = {}, currentInject }) {
       }, [])
 
       const rootRef = useRef(null)
-
-      useEffect(() => {
-        const unsubscribe = navigation.addListener('transitionEnd', (e) => {
-          setTimeout(() => {
-            rootRef.current?.measureInWindow((x, y, width, height) => {
-              navigation.layout = { x, y, width, height }
-            })
-          }, 200)
-        });
-        return unsubscribe;
-      }, [navigation]);
+      const onLayout = useCallback(() => {
+        setTimeout(() => {
+          rootRef.current?.measureInWindow((x, y, width, height) => {
+            navigation.layout = { x, y, width, height }
+          })
+        }, 200)
+      }, [])
 
       const withKeyboardAvoidingView = (element) => {
         if (__mpx_mode__ === 'ios') {
@@ -575,10 +571,12 @@ export function getDefaultOptions ({ type, rawOptions = {}, currentInject }) {
       if (setStateRef.current !== setState) {
         setStateRef.current = setState
       }
-
       return createElement(GestureHandlerRootView,
         {
-          style: {
+          // https://github.com/software-mansion/react-native-reanimated/issues/6639 因存在此问题，iOS在页面上进行定宽来暂时规避
+          style: __mpx_mode__ === 'ios' && pageConfig.navigationStyle !== 'custom' ? {
+            height: ReactNative.Dimensions.get('screen').height - useHeaderHeight()
+          } : {
             flex: 1
           }
         },
@@ -589,7 +587,8 @@ export function getDefaultOptions ({ type, rawOptions = {}, currentInject }) {
                 flex: 1,
                 backgroundColor: pageConfig.backgroundColor || '#ffffff'
               },
-              ref: rootRef
+              ref: rootRef,
+              onLayout
             },
             createElement(RouteContext.Provider,
               {

package/src/platform/patch/getDefaultOptions.js

@@ -23,13 +23,11 @@ function transformProperties (properties) {
     } else {
       newFiled = Object.assign({}, rawFiled)
     }
-    const rawObserver = rawFiled?.observer
     newFiled.observer = function (value, oldValue) {
       if (this.__mpxProxy) {
         this[key] = value
         this.__mpxProxy.propsUpdated()
       }
-      rawObserver && rawObserver.call(this, value, oldValue)
     }
     newProps[key] = newFiled
   })