@mpxjs/core 2.8.39 → 2.8.40-test.2

package/@types/index.d.ts

@@ -24,25 +24,37 @@ type UnionToIntersection<U> = (U extends any
   ? (k: U) => void
   : never) extends ((k: infer I) => void)
   ? I
-  : never;
+  : never
 
-type ArrayType<T extends any[]> = T extends Array<infer R> ? R : never;
+type ArrayType<T extends any[]> = T extends Array<infer R> ? R : never
 
 // Mpx types
 type Data = object | (() => object)
 
-type PropType = StringConstructor | NumberConstructor | BooleanConstructor | ObjectConstructor | ArrayConstructor | null
-
-interface PropOpt {
-  type: PropType
-  optionalTypes?: Array<PropType>
-  value?: any
-
-  observer? (value: any, old: any, changedPath: string): void
+export type PropType<T> = {
+  __type: T
+} & (
+  T extends String
+    ? StringConstructor
+    : T extends number
+      ? NumberConstructor
+      : T extends boolean
+        ? BooleanConstructor
+        : T extends any[]
+          ? ArrayConstructor
+          : T extends object
+            ? ObjectConstructor
+            : never
+  )
+
+type FullPropType<T> = {
+  type: PropType<T>
+  value?: T
+  optionalTypes?: WechatMiniprogram.Component.ShortProperty[]
 }
 
 interface Properties {
-  [key: string]: PropType | PropOpt
+  [key: string]: WechatMiniprogram.Component.AllProperty
 }
 
 interface Methods {
@@ -71,23 +83,17 @@ interface WatchField {
 
 type GetDataType<T> = T extends () => any ? ReturnType<T> : T
 
-type PropValueType<Def> = Def extends {
-    type: (...args: any[]) => infer T;
-    optionalType?: ((...args: any[]) => infer T)[];
-    value?: infer T;
-  }
-  ? T
-  : Def extends (...args: any[]) => infer T
-    ? T
-    : any;
-
-type GetPropsType<T> = {
-  readonly [K in keyof T]: PropValueType<T[K]>
+type GetPropsType<T extends Properties> = {
+  readonly [K in keyof T]: T[K] extends FullPropType<infer V>
+    ? V
+    : T[K] extends PropType<infer V>
+      ? V
+      : WechatMiniprogram.Component.PropertyToData<T[K]>
 }
 
 type RequiredPropertyNames<T> = {
   [K in keyof T]-?: T[K] extends undefined ? never : K
-}[keyof T];
+}[keyof T]
 
 type RequiredPropertiesForUnion<T> = T extends object ? Pick<T, RequiredPropertyNames<T>> : never
 
@@ -96,6 +102,7 @@ interface Mixin<D, P, C, M> {
   properties?: P
   computed?: C
   methods?: M
+
   [index: string]: any
 }
 
@@ -108,14 +115,16 @@ 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']
   createIntersectionObserver: WechatMiniprogram.Component.InstanceMethods<Record<string, any>>['createIntersectionObserver']
 }
 
-interface ComponentOpt<D, P, C, M, Mi extends Array<any>, S extends Record<any, any>> extends Partial<WechatMiniprogram.Component.Lifetimes & WechatMiniprogram.Component.OtherOption>{
+interface ComponentOpt<D extends Data, P extends Properties, C, M extends Methods, Mi extends Array<any>, S extends Record<any, any>> extends Partial<WechatMiniprogram.Component.Lifetimes & WechatMiniprogram.Component.OtherOption> {
   data?: D
   properties?: P
   computed?: C
@@ -133,15 +142,15 @@ interface ComponentOpt<D, P, C, M, Mi extends Array<any>, S extends Record<any,
   [index: string]: any
 }
 
-type PageOpt<D, P, C, M, Mi extends Array<any>, S extends Record<any, any>> =
+type PageOpt<D extends Data, P extends Properties, C, M extends Methods, Mi extends Array<any>, S extends Record<any, any>> =
   ComponentOpt<D, P, C, M, Mi, S>
   & Partial<WechatMiniprogram.Page.ILifetime>
 
-type ThisTypedPageOpt<D extends AnyObject, P, C, M, Mi extends Array<any>, S extends Record<any, any>, O = {}> =
+type ThisTypedPageOpt<D extends Data, P extends Properties, C, M extends Methods, Mi extends Array<any>, S extends Record<any, any>, O = {}> =
   PageOpt<D, P, C, M, Mi, S>
   & ThisType<ComponentIns<D, P, C, M, Mi, S, O>> & O
 
-type ThisTypedComponentOpt<D extends AnyObject, P, C, M, Mi extends Array<any>, S extends Record<any, any>, O = {}> =
+type ThisTypedComponentOpt<D extends Data, P extends Properties, C, M extends Methods, Mi extends Array<any>, S extends Record<any, any>, O = {}> =
   ComponentOpt<D, P, C, M, Mi, S>
   & ThisType<ComponentIns<D, P, C, M, Mi, S, O>> & O
 
@@ -169,13 +178,17 @@ type MpxComProps<O> = { $rawOptions: O }
 
 export interface MpxComponentIns {
   $refs: ObjectOf<WechatMiniprogram.NodesRef & ComponentIns<{}, {}, {}, {}, []>>
-  $asyncRefs : ObjectOf<Promise<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
+
   $i18n: {
     locale: string
     fallbackLocale: string
@@ -184,6 +197,7 @@ export interface MpxComponentIns {
   $tc: typeof tc
   $te: typeof te
   $tm: typeof tm
+
   [k: string]: any
 }
 
@@ -193,17 +207,16 @@ interface ReplaceWxComponentIns {
   selectAllComponents (selector: string): Array<ComponentIns<{}, {}, {}, {}, []>>
 }
 
-type WxComponentIns<D extends AnyObject> =
-  ReplaceWxComponentIns
-  & WechatMiniprogram.Component.InstanceProperties
-  & WechatMiniprogram.Component.InstanceMethods<D>
+type WxComponentIns<D extends Data = {}, P extends Properties = {}, M extends Methods = {}> =
+  Omit<WechatMiniprogram.Component.Instance<D, P, M>, 'selectComponent' | 'selectAllComponents'>
+  & ReplaceWxComponentIns
 
-type ComponentIns<D extends AnyObject, P, C, M, Mi extends Array<any>, S extends Record<any, any> = {}, O = {}> =
+type ComponentIns<D extends Data = {}, P extends Properties = {}, C = {}, M extends Methods = {}, Mi extends Array<any> = [], S extends Record<any, any> = {}, O = {}> =
   GetDataType<D> & UnboxMixinsField<Mi, 'data'> &
   M & UnboxMixinsField<Mi, 'methods'> & { [K in keyof S]: S[K] extends Ref<infer V> ? V : S[K] } &
   GetPropsType<P & UnboxMixinsField<Mi, 'properties'>> &
   GetComputedType<C & UnboxMixinsField<Mi, 'computed'>> &
-  WxComponentIns<D> & MpxComponentIns & MpxComProps<O>
+  WxComponentIns<D, P, M> & MpxComponentIns & MpxComProps<O>
 
 interface CreateConfig {
   customCtor: any
@@ -225,7 +238,10 @@ export function createApp<T extends WechatMiniprogram.IAnyObject> (opt: WechatMi
 
 type MixinType = 'app' | 'page' | 'component'
 
-export function injectMixins (mixins: object | Array<object>, options?: MixinType | MixinType[] | { types?: MixinType | MixinType[], stage?: number }): Mpx
+export function injectMixins (mixins: object | Array<object>, options?: MixinType | MixinType[] | {
+  types?: MixinType | MixinType[],
+  stage?: number
+}): Mpx
 
 // export function watch (expr: string | (() => any), handler: WatchHandler | WatchOptWithHandler, options?: WatchOpt): () => void
 
@@ -235,6 +251,11 @@ interface AnyConstructor {
   prototype: any
 }
 
+interface WebviewConfig {
+  hostWhitelists?: Array<string>
+  apiImplementations?: object
+}
+
 interface MpxConfig {
   useStrictDiff: boolean
   ignoreWarning: boolean | string | RegExp | ((msg: string, location: string, e: Error) => boolean)
@@ -244,7 +265,8 @@ interface MpxConfig {
   proxyEventHandler: (e: Event) => any | null
   setDataHandler: (data: object, target: ComponentIns<{}, {}, {}, {}, []>) => any | null
   forceFlushSync: boolean,
-  webRouteConfig: object
+  webRouteConfig: object,
+  webviewConfig?: WebviewConfig
 }
 
 type SupportedMode = 'wx' | 'ali' | 'qq' | 'swan' | 'tt' | 'web' | 'qa'
@@ -257,11 +279,11 @@ interface ImplementOptions {
 
 export function toPureObject<T extends object> (obj: T): T
 
-declare type PluginInstallFunction = (app: Mpx, ...options: any[]) => any;
+declare type PluginInstallFunction = (app: Mpx, ...options: any[]) => any
 
 export type Plugin = PluginInstallFunction | {
-  install: PluginInstallFunction;
-};
+  install: PluginInstallFunction
+}
 
 export interface Mpx {
   getMixin: typeof getMixin
@@ -318,7 +340,7 @@ export interface Ref<T = any> {
    * We need this to be in public d.ts but don't want it to show up in IDE
    * autocomplete, so we use a private Symbol instead.
    */
-    [RefSymbol]: true
+  [RefSymbol]: true
 }
 
 type CollectionTypes = IterableCollections | WeakCollections
@@ -427,7 +449,11 @@ export interface WatchOptions extends WatchEffectOptions {
 
 interface EffectScope {
   run<T> (fn: () => T): T | undefined // 如果作用域不活跃就为 undefined
-  stop (): void
+  stop (fromParent?: boolean): void
+
+  pause (): void
+
+  resume (ignoreDirty?: boolean): void
 }
 
 
@@ -486,7 +512,7 @@ export function reactive<T extends object> (target: T): Reactive<T>
 
 export function isReactive (value: unknown): boolean
 
-export function markRaw<T extends object>(value: T): T
+export function markRaw<T extends object> (value: T): T
 
 export function shallowReactive<T extends object> (target: T): ShallowReactive<T>
 
@@ -566,6 +592,7 @@ export function onBeforeUnmount (callback: () => void): void
 export function onUnmounted (callback: () => void): void
 
 export function onLoad<T extends Record<string, string | undefined>> (callback: (query: T) => void): void
+
 // wechat dose not have generics
 // export function onLoad (callback: WechatMiniprogram.Page.ILifetime['onLoad']): void
 
@@ -592,7 +619,7 @@ export function onTabItemTap (callback: WechatMiniprogram.Page.ILifetime['onTabI
 export function onSaveExitState (callback: () => void): void
 
 // get instance
-export function getCurrentInstance<T extends MpxComponentIns & WechatMiniprogram.Component.Instance<{}, {}, {}>> (): T
+export function getCurrentInstance<T extends ComponentIns<{}, {}, {}>> (): { proxy: T, [x: string]: any }
 
 // I18n
 export function useI18n<Options extends {
@@ -612,8 +639,7 @@ type InferDefaults<T> = {
   [K in keyof T]?: InferDefault<T, NotUndefined<T[K]>>
 }
 
-type InferDefault<P, T> = T extends
-  | null
+type InferDefault<P, T> = T extends | null
   | number
   | string
   | boolean
@@ -642,7 +668,7 @@ export const ONHIDE: string
 export const ONRESIZE: string
 
 declare global {
-  const defineProps: (<T>(props: T) => Readonly<GetPropsType<T>>) & (<T>() => Readonly<T>)
+  const defineProps: (<T extends Properties = {}>(props: T) => Readonly<GetPropsType<T>>) & (<T>() => Readonly<T>)
   const defineOptions: <D extends Data = {}, P extends Properties = {}, C = {}, M extends Methods = {}, Mi extends Array<any> = [], S extends AnyObject = {}, O extends AnyObject = {}> (opt: ThisTypedComponentOpt<D, P, C, M, Mi, S, O>) => void
   const defineExpose: <E extends AnyObject = AnyObject>(exposed?: E) => void
   const useContext: () => Context

package/@types/node.d.ts

@@ -12,19 +12,21 @@ declare let process: {
   env: EnvType
 }
 
- declare namespace __WebpackModuleApi {
-
+declare namespace __WebpackModuleApi {
   interface RequireContext {
-    keys(): string[];
+    keys (): string[];
+
     (id: string): any;
-    <T>(id: string): T;
-    resolve(id: string): string;
+
+    <T> (id: string): T;
+
+    resolve (id: string): string;
+
     /** The module id of the context module. This may be useful for module.hot.accept. */
     id: string;
   }
 }
 
-declare namespace require {
-  export function context(path: string, deep?: boolean, filter?: RegExp, mode?: 'sync' | 'eager' | 'weak' | 'lazy' | 'lazy-once'): __WebpackModuleApi.RequireContext;
-  export function async<T>(path: string): Promise<T>
+interface Require {
+  context (path: string, deep?: boolean, filter?: RegExp, mode?: 'sync' | 'eager' | 'weak' | 'lazy' | 'lazy-once'): __WebpackModuleApi.RequireContext
 }

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@mpxjs/core",
-  "version": "2.8.39",
+  "version": "2.8.40-test.2",
   "description": "mpx runtime core",
   "keywords": [
     "miniprogram",
     "mpx"
   ],
   "author": "donghongping",
-  "license": "Apache",
+  "license": "Apache-2.0",
   "module": "src/index.js",
   "types": "@types/index.d.ts",
   "directories": {
@@ -19,15 +19,15 @@
   ],
   "main": "src/index.js",
   "dependencies": {
-    "@mpxjs/utils": "^2.8.15",
+    "@mpxjs/utils": "^2.8.40-test.2",
     "lodash": "^4.1.1",
-    "miniprogram-api-typings": "^3.0.2"
+    "miniprogram-api-typings": "^3.10.0"
   },
   "peerDependencies": {
-    "@mpxjs/api-proxy": "^2.7.44",
-    "@mpxjs/store": "^2.8.0",
+    "@mpxjs/api-proxy": "^2.9.0",
+    "@mpxjs/store": "^2.9.0",
     "vue": "^2.7.10",
-    "vue-demi": "^0.13.11",
+    "vue-demi": "^0.14.6",
     "vue-i18n": "^8.27.2",
     "vue-i18n-bridge": "^9.2.2"
   },
@@ -47,5 +47,5 @@
     "url": "https://github.com/didi/mpx/issues"
   },
   "sideEffects": false,
-  "gitHead": "c11c93eeb5315c5ff54df7ace05709a21bdaea53"
+  "gitHead": "7b1911025a2eb47eddc046775f17b6f1405fdd54"
 }

package/src/core/injectMixins.js

@@ -19,7 +19,7 @@ export function injectMixins (mixins, options = {}) {
     }
   }
 
-  let types = options.types || ['app', 'page', 'component']
+  let types = options.types || ['page', 'component']
   const stage = options.stage || -1
 
   if (typeof types === 'string') {

package/src/core/innerLifecycle.js

@@ -10,6 +10,7 @@ export const ONLOAD = '__onLoad__'
 export const ONSHOW = '__onShow__'
 export const ONHIDE = '__onHide__'
 export const ONRESIZE = '__onResize__'
+export const SERVERPREFETCH = '__serverPrefetch__'
 
 export const INNER_LIFECYCLES = [
   BEFORECREATE,
@@ -19,6 +20,7 @@ export const INNER_LIFECYCLES = [
   BEFOREUPDATE,
   UPDATED,
   BEFOREUNMOUNT,
+  SERVERPREFETCH,
   UNMOUNTED,
   ONLOAD,
   ONSHOW,

package/src/core/mergeOptions.js

@@ -314,17 +314,19 @@ export function mergeToArray (parent, child, key) {
 function composeHooks (target, includes) {
   Object.keys(target).forEach(key => {
     if (!includes || includes[key]) {
-      const hooksArr = target[key]
-      hooksArr && (target[key] = function (...args) {
-        let result
-        for (let i = 0; i < hooksArr.length; i++) {
-          if (typeof hooksArr[i] === 'function') {
-            const data = hooksArr[i].apply(this, args)
-            data !== undefined && (result = data)
+      const hooks = target[key]
+      if (Array.isArray(hooks)) {
+        target[key] = function (...args) {
+          let result
+          for (let i = 0; i < hooks.length; i++) {
+            if (typeof hooks[i] === 'function') {
+              const data = hooks[i].apply(this, args)
+              data !== undefined && (result = data)
+            }
           }
+          return result
         }
-        return result
-      })
+      }
     }
   })
 }
@@ -352,7 +354,7 @@ function transformHOOKS (options) {
     const componentHooksMap = makeMap(convertRule.lifecycle.component)
     for (const key in options) {
       // 使用Component创建page实例，页面专属生命周期&自定义方法需写在methods内部
-      if (typeof options[key] === 'function' && key !== 'dataFn' && key !== 'setup' && !componentHooksMap[key]) {
+      if (typeof options[key] === 'function' && key !== 'dataFn' && key !== 'setup' && key !== 'serverPrefetch' && !componentHooksMap[key]) {
         if (!options.methods) options.methods = {}
         options.methods[key] = options[key]
         delete options[key]

package/src/core/proxy.js

@@ -26,7 +26,8 @@ import {
   getFirstKey,
   callWithErrorHandling,
   warn,
-  error
+  error,
+  getEnvObj
 } from '@mpxjs/utils'
 import {
   BEFORECREATE,
@@ -36,6 +37,7 @@ import {
   BEFOREUPDATE,
   UPDATED,
   BEFOREUNMOUNT,
+  SERVERPREFETCH,
   UNMOUNTED,
   ONLOAD,
   ONSHOW,
@@ -45,6 +47,8 @@ import {
 
 let uid = 0
 
+const envObj = getEnvObj()
+
 class RenderTask {
   resolved = false
 
@@ -235,14 +239,14 @@ export default class MpxProxy {
       const setupResult = callWithErrorHandling(setup, this, 'setup function', [
         this.props,
         {
-          triggerEvent: this.target.triggerEvent.bind(this.target),
+          triggerEvent: this.target.triggerEvent ? this.target.triggerEvent.bind(this.target) : noop,
           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),
-          createSelectorQuery: this.target.createSelectorQuery.bind(this.target),
-          createIntersectionObserver: this.target.createIntersectionObserver.bind(this.target)
+          createSelectorQuery: this.target.createSelectorQuery ? this.target.createSelectorQuery.bind(this.target) : envObj.createSelectorQuery.bind(envObj),
+          createIntersectionObserver: this.target.createIntersectionObserver ? this.target.createIntersectionObserver.bind(this.target) : envObj.createIntersectionObserver.bind(envObj)
         }
       ])
       if (!isObject(setupResult)) {
@@ -308,7 +312,16 @@ export default class MpxProxy {
   watch (source, cb, options) {
     const target = this.target
     const getter = isString(source)
-      ? () => getByPath(target, source)
+      ? () => {
+        // for watch multi path string like 'a.b,c,d'
+        if (source.indexOf(',') > -1) {
+          return source.split(',').map(path => {
+            return getByPath(target, path.trim())
+          })
+        } else {
+          return getByPath(target, source)
+        }
+      }
       : source.bind(target)
 
     if (isObject(cb)) {
@@ -526,6 +539,10 @@ export default class MpxProxy {
   initRender () {
     if (this.options.__nativeRender__) return this.doRender()
 
+    const _i = this.target._i.bind(this.target)
+    const _c = this.target._c.bind(this.target)
+    const _r = this.target._r.bind(this.target)
+    const _sc = this.target._sc.bind(this.target)
     const effect = this.effect = new ReactiveEffect(() => {
       // pre render for props update
       if (this.propsUpdatedFlag) {
@@ -534,7 +551,7 @@ export default class MpxProxy {
 
       if (this.target.__injectedRender) {
         try {
-          return this.target.__injectedRender()
+          return this.target.__injectedRender(_i, _c, _r, _sc)
         } catch (e) {
           warn('Failed to execute render function, degrade to full-set-data mode.', this.options.mpxFileResource, e)
           this.render()
@@ -604,7 +621,9 @@ export default class MpxProxy {
 
 export let currentInstance = null
 
-export const getCurrentInstance = () => currentInstance?.target
+export const getCurrentInstance = () => {
+  return currentInstance && { proxy: currentInstance?.target }
+}
 
 export const setCurrentInstance = (instance) => {
   currentInstance = instance
@@ -641,6 +660,7 @@ export const onLoad = createHook(ONLOAD)
 export const onShow = createHook(ONSHOW)
 export const onHide = createHook(ONHIDE)
 export const onResize = createHook(ONRESIZE)
+export const onServerPrefetch = createHook(SERVERPREFETCH)
 export const onPullDownRefresh = createHook('__onPullDownRefresh__')
 export const onReachBottom = createHook('__onReachBottom__')
 export const onShareAppMessage = createHook('__onShareAppMessage__')

package/src/index.js

@@ -29,6 +29,7 @@ export {
   UPDATED,
   BEFOREUNMOUNT,
   UNMOUNTED,
+  SERVERPREFETCH,
   ONLOAD,
   ONSHOW,
   ONHIDE,
@@ -42,6 +43,7 @@ export {
   onUpdated,
   onBeforeUnmount,
   onUnmounted,
+  onServerPrefetch,
   onLoad,
   onShow,
   onHide,
@@ -135,7 +137,13 @@ Mpx.config = {
   proxyEventHandler: null,
   setDataHandler: null,
   forceFlushSync: false,
-  webRouteConfig: {}
+  webRouteConfig: {},
+  /*
+    支持两个属性
+    hostWhitelists Array 类型 支持h5域名白名单安全校验
+    apiImplementations webview JSSDK接口 例如getlocation
+   */
+  webviewConfig: {}
 }
 
 global.__mpx = Mpx

package/src/observer/effect.js

@@ -119,7 +119,9 @@ export class ReactiveEffect {
   }
 
   pause () {
-    this.pausedState = PausedState.paused
+    if (this.pausedState !== PausedState.dirty) {
+      this.pausedState = PausedState.paused
+    }
   }
 
   resume (ignoreDirty = false) {

package/src/platform/builtInMixins/pageRouteMixin.js

@@ -4,6 +4,19 @@ export default function pageRouteMixin (mixinType) {
     return {
       beforeCreate () {
         this.route = this.$options.__mpxPageRoute || ''
+      },
+      methods: {
+        getOpenerEventChannel () {
+          const router = global.__mpxRouter
+          const eventChannel = router && router.eventChannelMap[this.route]
+          return eventChannel || {}
+        }
+      }
+    }
+  }
+  return {
+    methods: {
+      getOpenerEventChannel () {
       }
     }
   }

package/src/platform/builtInMixins/pageScrollMixin.web.js

@@ -41,6 +41,7 @@ export default function pageScrollMixin (mixinType) {
   return {
     mounted () {
       this.__lastScrollY = 0
+      this.__originalOverflow = document.body.style.overflow
     },
     activated () {
       if (!refreshMs()) {
@@ -72,19 +73,22 @@ export default function pageScrollMixin (mixinType) {
       }
     },
     deactivated () {
-      if (ms) {
+      if (ms) { // 保存滚动位置, 用于 keep-alive
         this.__lastScrollY = getScrollTop()
-        ms.destroy()
-        hideLoading(this)
       }
+      this.__uninstallMpxScroll()
     },
     beforeDestroy () {
-      if (ms) {
-        ms.destroy()
-        hideLoading(this)
-      }
+      this.__uninstallMpxScroll()
     },
     methods: {
+      __uninstallMpxScroll () {
+        if (ms) {
+          ms.destroy()
+          hideLoading(this)
+          document.body.style.overflow = this.__originalOverflow // 恢复原有 overflow, 避免影响其他页面
+        }
+      },
       __mpxPullDownHandler (autoStop = false, isRefresh = false) {
         this.__pullingDown = true
         // 同微信保持一致

package/src/platform/builtInMixins/pageStatusMixin.web.js

@@ -1,4 +1,5 @@
 import {
+  BEFORECREATE,
   CREATED,
   ONHIDE,
   ONSHOW,
@@ -47,6 +48,18 @@ if (isBrowser) {
   window.addEventListener('resize', onResize)
 }
 
+function getParentPage (vm) {
+  let parent = vm.$parent
+  while (parent) {
+    if (parent.route) {
+      return parent
+    } else if (parent.$page) {
+      return parent.$page
+    }
+    parent = parent.$parent
+  }
+}
+
 export default function pageStatusMixin (mixinType) {
   const mixin = {}
 
@@ -63,33 +76,44 @@ export default function pageStatusMixin (mixinType) {
       },
       created () {
         // onLoad应该在用户声明周期CREATED后再执行，故此处使用原生created声明周期来触发onLoad
-        const query = (global.__mpxRouter && global.__mpxRouter.currentRoute && global.__mpxRouter.currentRoute.query) || {}
+        const query = this.$root.$options?.router?.currentRoute?.query || {}
         this.__mpxProxy.callHook(ONLOAD, [query])
       }
     })
   }
 
+  // 创建组件时记录当前所属page，用于驱动pageLifetimes和onShow/onHide钩子
+  if (mixinType === 'component') {
+    Object.assign(mixin, {
+      [BEFORECREATE] () {
+        this.$page = getParentPage(this)
+      }
+    })
+  }
+
   Object.assign(mixin, {
     [CREATED] () {
-      const pageInstance = mixinType === 'page' ? this : getCurrentPageInstance()
-      if (pageInstance) {
-        this.$watch(() => pageInstance.mpxPageStatus, status => {
-          if (!status) return
-          if (status === 'show') this.__mpxProxy.callHook(ONSHOW)
-          if (status === 'hide') this.__mpxProxy.callHook(ONHIDE)
-          const pageLifetimes = this.__mpxProxy.options.pageLifetimes
-          if (pageLifetimes) {
-            if (/^resize/.test(status) && isFunction(pageLifetimes.resize)) {
-              // resize
-              pageLifetimes.resize.call(this, systemInfo)
-            } else if (isFunction(pageLifetimes[status])) {
-              // show & hide
-              pageLifetimes[status].call(this)
+      if (isBrowser) {
+        const pageInstance = mixinType === 'page' ? this : this.$page
+        if (pageInstance) {
+          this.$watch(() => pageInstance.mpxPageStatus, status => {
+            if (!status) return
+            if (status === 'show') this.__mpxProxy.callHook(ONSHOW)
+            if (status === 'hide') this.__mpxProxy.callHook(ONHIDE)
+            const pageLifetimes = this.__mpxProxy.options.pageLifetimes
+            if (pageLifetimes) {
+              if (/^resize/.test(status) && isFunction(pageLifetimes.resize)) {
+                // resize
+                pageLifetimes.resize.call(this, systemInfo)
+              } else if (isFunction(pageLifetimes[status])) {
+                // show & hide
+                pageLifetimes[status].call(this)
+              }
             }
-          }
-        }, {
-          sync: true
-        })
+          }, {
+            sync: true
+          })
+        }
       }
     }
   })

package/src/platform/builtInMixins/proxyEventMixin.js

@@ -1,4 +1,4 @@
-import { setByPath, error, hasOwn } from '@mpxjs/utils'
+import { setByPath, error, hasOwn, dash2hump } from '@mpxjs/utils'
 import Mpx from '../../index'
 
 const datasetReg = /^data-(.+)$/
@@ -35,7 +35,9 @@ export default function proxyEventMixin () {
       let fallbackType = ''
       if (type === 'begin' || type === 'end') {
         // 地图的 regionchange 事件会派发 e.type 为 begin 和 end 的事件
-        fallbackType = 'regionchange'
+        fallbackType = __mpx_mode__ === 'ali' ? 'regionChange' : 'regionchange'
+      } else if (/-([a-z])/.test(type)) {
+        fallbackType = dash2hump(type)
       } else if (__mpx_mode__ === 'ali') {
         fallbackType = type.replace(/^./, i => i.toLowerCase())
       }
@@ -99,15 +101,8 @@ export default function proxyEventMixin () {
           const eventObj = {
             type: eventName,
             timeStamp,
-            target: {
-              id,
-              dataset,
-              targetDataset: dataset
-            },
-            currentTarget: {
-              id,
-              dataset
-            },
+            target: { id, dataset, targetDataset: dataset },
+            currentTarget: { id, dataset },
             detail: eventDetail
           }
           handler.call(this, eventObj)

package/src/platform/builtInMixins/proxyEventMixin.web.js

@@ -18,11 +18,6 @@ export default function proxyEventMixin () {
         const originValue = valuePath.reduce((acc, cur) => acc[cur], $event.detail)
         const value = filterMethod ? (innerFilter[filterMethod] ? innerFilter[filterMethod](originValue) : typeof this[filterMethod] === 'function' && this[filterMethod]) : originValue
         setByPath(this, expr, value)
-      },
-      getOpenerEventChannel () {
-        const router = global.__mpxRouter
-        const eventChannel = router && router.__mpxAction && router.__mpxAction.eventChannel
-        return eventChannel
       }
     }
   }

package/src/platform/builtInMixins/refsMixin.web.js

@@ -1,5 +1,5 @@
 import { BEFOREMOUNT, UPDATED } from '../../core/innerLifecycle'
-import * as webApi from '@mpxjs/api-proxy/src/web/api'
+import { createSelectorQuery } from '@mpxjs/api-proxy'
 
 function getEl (ref) {
   if (ref && ref.nodeType === 1) return ref
@@ -8,19 +8,19 @@ function getEl (ref) {
 
 function processRefs (refs) {
   Object.keys(refs).forEach((key) => {
-    const matched = /^__mpx_ref_([^_]+)__$/.exec(key)
+    const matched = /^__mpx_ref_(.+)__$/.exec(key)
     const rKey = matched && matched[1]
     if (rKey) {
       const ref = refs[key]
       if (Array.isArray(ref)) {
         if (getEl(ref[0])) {
-          refs[rKey] = webApi.createSelectorQuery().in(this).selectAll(ref.map(getEl))
+          refs[rKey] = createSelectorQuery().in(this).selectAll(ref.map(getEl))
         } else {
           refs[rKey] = ref
         }
       } else {
         if (getEl(ref)) {
-          refs[rKey] = webApi.createSelectorQuery().in(this).select(getEl(ref))
+          refs[rKey] = createSelectorQuery().in(this).select(getEl(ref))
         } else {
           refs[rKey] = ref
         }

package/src/platform/builtInMixins/renderHelperMixin.js

@@ -1,4 +1,4 @@
-import { isObject } from '@mpxjs/utils'
+import { getByPath, hasOwn, isObject } from '@mpxjs/utils'
 
 export default function renderHelperMixin () {
   return {
@@ -21,10 +21,21 @@ export default function renderHelperMixin () {
           }
         }
       },
+      // collect
       _c (key, value) {
+        if (hasOwn(this.__mpxProxy.renderData, key)) {
+          return this.__mpxProxy.renderData[key]
+        }
+        if (value === undefined) {
+          value = getByPath(this, key)
+        }
         this.__mpxProxy.renderData[key] = value
         return value
       },
+      // simple collect
+      _sc (key) {
+        return (this.__mpxProxy.renderData[key] = this[key])
+      },
       _r () {
         this.__mpxProxy.renderWithData()
       }

package/src/platform/createApp.js

@@ -1,11 +1,12 @@
 import transferOptions from '../core/transferOptions'
 import mergeOptions from '../core/mergeOptions'
 import builtInKeysMap from './patch/builtInKeysMap'
-import { makeMap, spreadProp } from '@mpxjs/utils'
+import { makeMap, spreadProp, isBrowser } from '@mpxjs/utils'
+import { mergeLifecycle } from '../convertor/mergeLifecycle'
 import * as webLifecycle from '../platform/patch/web/lifecycle'
 import Mpx from '../index'
 
-const webAppHooksMap = makeMap(webLifecycle.LIFECYCLE.APP_HOOKS)
+const webAppHooksMap = makeMap(mergeLifecycle(webLifecycle.LIFECYCLE).app)
 
 function filterOptions (options, appData) {
   const newOptions = {}
@@ -35,7 +36,7 @@ export default function createApp (option, config = {}) {
       created () {
         Object.assign(this, Mpx.prototype)
         Object.assign(this, appData)
-        const current = (global.__mpxRouter && global.__mpxRouter.currentRoute) || {}
+        const current = this.$root.$options?.router?.currentRoute || {}
         const options = {
           path: current.path && current.path.replace(/^\//, ''),
           query: current.query,
@@ -49,19 +50,24 @@ export default function createApp (option, config = {}) {
           hide: [],
           error: []
         }
-        if (this.$options.onShow) {
-          this.$options.onShow.call(this, options)
-          global.__mpxAppCbs.show.push(this.$options.onShow.bind(this))
-        }
-        if (this.$options.onHide) {
-          global.__mpxAppCbs.hide.push(this.$options.onHide.bind(this))
-        }
-        if (this.$options.onError) {
-          global.__mpxAppCbs.error.push(this.$options.onError.bind(this))
+        if (isBrowser) {
+          if (this.$options.onShow) {
+            this.$options.onShow.call(this, options)
+            global.__mpxAppCbs.show.push(this.$options.onShow.bind(this))
+          }
+          if (this.$options.onHide) {
+            global.__mpxAppCbs.hide.push(this.$options.onHide.bind(this))
+          }
+          if (this.$options.onError) {
+            global.__mpxAppCbs.error.push(this.$options.onError.bind(this))
+          }
         }
       }
     })
   } else {
+    if (option.onAppInit) {
+      option.onAppInit()
+    }
     builtInMixins.push({
       onLaunch () {
         Object.assign(this, Mpx.prototype)
@@ -77,6 +83,9 @@ export default function createApp (option, config = {}) {
     global.__mpxOptionsMap = global.__mpxOptionsMap || {}
     global.__mpxOptionsMap[global.currentModuleId] = defaultOptions
     global.getApp = function () {
+      if (!isBrowser) {
+        console.error('[Mpx runtime error]: Dangerous API! global.getApp method is running in non browser environments')
+      }
       return appData
     }
   } else {

package/src/platform/export/index.web.js

@@ -1,8 +1,60 @@
-import {
-  effectScope as vueEffectScope,
-  getCurrentScope as getCurrentVueScope,
-  onScopeDispose
-} from 'vue'
+import { EffectScope } from 'vue'
+import { hasOwn } from '@mpxjs/utils'
+import { PausedState } from '../../helper/const'
+
+const hackEffectScope = () => {
+  EffectScope.prototype.pause = function () {
+    if (this.active) {
+      let i, l
+      for (i = 0, l = this.effects.length; i < l; i++) {
+        const effect = this.effects[i]
+        // vue2.7中存在对于watcher实例方法的重写(doWatch)，因此无法通过修改Watcher.prototype统一实现pause和resume，只能逐个实例修改实现
+        if (!hasOwn(effect, 'pausedState')) {
+          effect.pausedState = PausedState.resumed
+          const rawUpdate = effect.update
+          effect.update = function () {
+            if (effect.pausedState !== PausedState.resumed) {
+              effect.pausedState = PausedState.dirty
+            } else {
+              rawUpdate.call(effect)
+            }
+          }
+        }
+        if (effect.pausedState !== PausedState.dirty) {
+          effect.pausedState = PausedState.paused
+        }
+      }
+      if (this.scopes) {
+        for (i = 0, l = this.scopes.length; i < l; i++) {
+          this.scopes[i].pause()
+        }
+      }
+    }
+  }
+
+  EffectScope.prototype.resume = function (ignoreDirty = false) {
+    if (this.active) {
+      let i, l
+      for (i = 0, l = this.effects.length; i < l; i++) {
+        const effect = this.effects[i]
+        if (hasOwn(effect, 'pausedState')) {
+          const lastPausedState = effect.pausedState
+          effect.pausedState = PausedState.resumed
+          if (!ignoreDirty && lastPausedState === PausedState.dirty) {
+            effect.update()
+          }
+        }
+      }
+      if (this.scopes) {
+        for (i = 0, l = this.scopes.length; i < l; i++) {
+          this.scopes[i].resume(ignoreDirty)
+        }
+      }
+    }
+  }
+}
+
+hackEffectScope()
 
 export {
   // watch
@@ -29,27 +81,12 @@ export {
   // computed
   computed,
   // instance
-  getCurrentInstance
-} from 'vue'
-
-const noop = () => {
-}
-
-const fixEffectScope = (scope) => {
-  scope.pause = noop
-  scope.resume = noop
-  return scope
-}
-
-const effectScope = (detached) => fixEffectScope(vueEffectScope(detached))
-const getCurrentScope = () => fixEffectScope(getCurrentVueScope())
-
-export {
+  getCurrentInstance,
   // effectScope
   effectScope,
   getCurrentScope,
   onScopeDispose
-}
+} from 'vue'
 
 export {
   // i18n

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

@@ -1,7 +1,7 @@
 import MpxProxy from '../../../core/proxy'
 import builtInKeysMap from '../builtInKeysMap'
 import mergeOptions from '../../../core/mergeOptions'
-import { isFunction, error, diffAndCloneA, hasOwn } from '@mpxjs/utils'
+import { isFunction, error, diffAndCloneA, hasOwn, noop } from '@mpxjs/utils'
 
 function transformApiForProxy (context, currentInject) {
   const rawSetData = context.setData.bind(context)
@@ -45,16 +45,14 @@ function transformApiForProxy (context, currentInject) {
     }
   })
   if (currentInject) {
-    if (currentInject.render) {
-      Object.defineProperties(context, {
-        __injectedRender: {
-          get () {
-            return currentInject.render.bind(context)
-          },
-          configurable: false
-        }
-      })
-    }
+    Object.defineProperties(context, {
+      __injectedRender: {
+        get () {
+          return currentInject.render || noop
+        },
+        configurable: false
+      }
+    })
     if (currentInject.getRefsData) {
       Object.defineProperties(context, {
         __getRefsData: {

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

@@ -3,7 +3,7 @@ import mergeOptions from '../../../core/mergeOptions'
 import { diffAndCloneA, hasOwn } from '@mpxjs/utils'
 import { getCurrentInstance as getCurrentVueInstance } from '../../export/index'
 import MpxProxy, { setCurrentInstance, unsetCurrentInstance } from '../../../core/proxy'
-import { BEFORECREATE, BEFOREUPDATE, UPDATED, BEFOREUNMOUNT, UNMOUNTED } from '../../../core/innerLifecycle'
+import { BEFORECREATE, BEFOREUPDATE, UPDATED, BEFOREUNMOUNT, UNMOUNTED, SERVERPREFETCH } from '../../../core/innerLifecycle'
 
 function filterOptions (options) {
   const newOptions = {}
@@ -79,6 +79,9 @@ export function getDefaultOptions (type, { rawOptions = {} }) {
     },
     destroyed () {
       if (this.__mpxProxy) this.__mpxProxy.callHook(UNMOUNTED)
+    },
+    serverPrefetch () {
+      if (this.__mpxProxy) return this.__mpxProxy.callHook(SERVERPREFETCH)
     }
   }]
   // 为了在builtMixin中可以使用某些rootMixin实现的特性（如数据响应等），此处builtInMixin在rootMixin之后执行，但是当builtInMixin使用存在对应内建生命周期的目标平台声明周期写法时，可能会出现用户生命周期比builtInMixin中的生命周期先执行的情况，为了避免这种情况发生，builtInMixin应该尽可能使用内建生命周期来编写

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

@@ -9,7 +9,8 @@ const COMPONENT_HOOKS = [
   'deactivated',
   'beforeDestroy',
   'destroyed',
-  'errorCaptured'
+  'errorCaptured',
+  'serverPrefetch'
 ]
 
 const PAGE_HOOKS = [
@@ -38,7 +39,9 @@ const APP_HOOKS = [
   'onError',
   'onPageNotFound',
   'onUnhandledRejection',
-  'onThemeChange'
+  'onThemeChange',
+  'onSSRAppCreated',
+  'onAppInit'
 ]
 
 export const LIFECYCLE = {

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

@@ -1,4 +1,4 @@
-import { hasOwn } from '@mpxjs/utils'
+import { hasOwn, noop } from '@mpxjs/utils'
 import MpxProxy from '../../../core/proxy'
 import builtInKeysMap from '../builtInKeysMap'
 import mergeOptions from '../../../core/mergeOptions'
@@ -83,16 +83,14 @@ function transformApiForProxy (context, currentInject) {
 
   // 绑定注入的render
   if (currentInject) {
-    if (currentInject.render) {
-      Object.defineProperties(context, {
-        __injectedRender: {
-          get () {
-            return currentInject.render
-          },
-          configurable: false
-        }
-      })
-    }
+    Object.defineProperties(context, {
+      __injectedRender: {
+        get () {
+          return currentInject.render || noop
+        },
+        configurable: false
+      }
+    })
     if (currentInject.getRefsData) {
       Object.defineProperties(context, {
         __getRefsData: {

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

@@ -14,7 +14,8 @@ const APP_HOOKS = [
   'onError',
   'onPageNotFound',
   'onUnhandledRejection',
-  'onThemeChange'
+  'onThemeChange',
+  'onAppInit'
 ]
 
 const PAGE_HOOKS = [

package/src/vuePlugin.js

@@ -1,12 +1,39 @@
-import { walkChildren, parseSelector, error } from '@mpxjs/utils'
-import * as webApi from '@mpxjs/api-proxy/src/web/api'
+import { walkChildren, parseSelector, error, hasOwn } from '@mpxjs/utils'
+import { createSelectorQuery, createIntersectionObserver } from '@mpxjs/api-proxy'
+const datasetReg = /^data-(.+)$/
+
+function collectDataset (attrs) {
+  const dataset = {}
+  for (const key in attrs) {
+    if (hasOwn(attrs, key)) {
+      const matched = datasetReg.exec(key)
+      if (matched) {
+        dataset[matched[1]] = attrs[key]
+      }
+    }
+  }
+  return dataset
+}
 
 export default function install (Vue) {
   Vue.prototype.triggerEvent = function (eventName, eventDetail) {
-    return this.$emit(eventName, {
+    // 输出Web时自定义组件绑定click事件会和web原生事件冲突，组件内部triggerEvent时会导致事件执行两次，将click事件改为_click来规避此问题
+    const escapeEvents = ['click']
+    if (escapeEvents.includes(eventName)) {
+      eventName = '_' + eventName
+    }
+    let eventObj = {}
+    const dataset = collectDataset(this.$attrs)
+    const id = this.$attrs.id || ''
+    const timeStamp = +new Date()
+    eventObj = {
       type: eventName,
+      timeStamp,
+      target: { id, dataset, targetDataset: dataset },
+      currentTarget: { id, dataset },
       detail: eventDetail
-    })
+    }
+    return this.$emit(eventName, eventObj)
   }
   Vue.prototype.selectComponent = function (selector, all) {
     const result = []
@@ -23,9 +50,9 @@ export default function install (Vue) {
     return this.selectComponent(selector, true)
   }
   Vue.prototype.createSelectorQuery = function () {
-    return webApi.createSelectorQuery().in(this)
+    return createSelectorQuery().in(this)
   }
   Vue.prototype.createIntersectionObserver = function (component, options) {
-    return webApi.createIntersectionObserver(component, options)
+    return createIntersectionObserver(this, options)
   }
 }