feat(h5): add setupWindow

packages/uni-components/src/helpers/useListeners.ts

@@ -4,7 +4,7 @@ import { useCurrentPageId } from '@dcloudio/uni-core'
 
 export function useListeners(
   props: { id: string },
-  listeners: Record<string, Function>
+  listeners: Record<string, (...args: any[]) => void>
 ) {
   if (__NODE_JS__) {
     return
@@ -26,7 +26,7 @@ export function useListeners(
 
 function _addListeners(
   id: string,
-  listeners: Record<string, Function>,
+  listeners: Record<string, (...args: any[]) => void>,
   watch?: boolean
 ) {
   const pageId = useCurrentPageId()
@@ -59,7 +59,7 @@ function _addListeners(
 
 function _removeListeners(
   id: string,
-  listeners: Record<string, Function>,
+  listeners: Record<string, (...args: any[]) => void>,
   watch?: boolean
 ) {
   const pageId = useCurrentPageId()

packages/uni-h5-vite/dist/plugins/pagesJson.js

@@ -37,7 +37,7 @@ function generatePagesJsonCode(ssr, jsonStr, config) {
     const cssCode = generateCssCode(config);
     return `
 import { defineAsyncComponent, resolveComponent, createVNode, withCtx, openBlock, createBlock } from 'vue'
-import { PageComponent, AsyncLoadingComponent, AsyncErrorComponent } from '@dcloudio/uni-h5'
+import { PageComponent, AsyncLoadingComponent, AsyncErrorComponent, setupWindow } from '@dcloudio/uni-h5'
 import { appid, debug, networkTimeout, router, async, sdkConfigs, qqMapKey, nvue } from '${manifestJsonPath}'
 ${importLayoutComponentsCode}
 const extend = Object.assign
@@ -116,18 +116,18 @@ function generateCssCode(config) {
     return cssFiles.map((file) => `import '${file}'`).join('\n');
 }
 function generateLayoutComponentsCode(globalName, pagesJson) {
-    const windowNames = [
-        'topWindow',
-        'leftWindow',
-        'rightWindow',
-    ];
+    const windowNames = {
+        topWindow: -1,
+        leftWindow: -2,
+        rightWindow: -3,
+    };
     let importLayoutComponentsCode = '';
     let defineLayoutComponentsCode = `${globalName}.__uniLayout = ${globalName}.__uniLayout || {}\n`;
-    windowNames.forEach((name) => {
+    Object.keys(windowNames).forEach((name) => {
         const windowConfig = pagesJson[name];
         if (windowConfig && windowConfig.path) {
             importLayoutComponentsCode += `import ${name} from './${windowConfig.path}'\n`;
-            defineLayoutComponentsCode += `${globalName}.__uniConfig.${name}.component = ${name}\n`;
+            defineLayoutComponentsCode += `${globalName}.__uniConfig.${name}.component = setupWindow(${name},${windowNames[name]})\n`;
         }
     });
     return {

packages/uni-h5-vite/src/plugins/pagesJson.ts

@@ -54,7 +54,7 @@ function generatePagesJsonCode(
 
   return `
 import { defineAsyncComponent, resolveComponent, createVNode, withCtx, openBlock, createBlock } from 'vue'
-import { PageComponent, AsyncLoadingComponent, AsyncErrorComponent } from '@dcloudio/uni-h5'
+import { PageComponent, AsyncLoadingComponent, AsyncErrorComponent, setupWindow } from '@dcloudio/uni-h5'
 import { appid, debug, networkTimeout, router, async, sdkConfigs, qqMapKey, nvue } from '${manifestJsonPath}'
 ${importLayoutComponentsCode}
 const extend = Object.assign
@@ -143,18 +143,20 @@ function generateLayoutComponentsCode(
   globalName: string,
   pagesJson: UniApp.PagesJson
 ) {
-  const windowNames: Array<'topWindow' | 'leftWindow' | 'rightWindow'> = [
-    'topWindow',
-    'leftWindow',
-    'rightWindow',
-  ]
+  const windowNames = {
+    topWindow: -1,
+    leftWindow: -2,
+    rightWindow: -3,
+  }
   let importLayoutComponentsCode = ''
   let defineLayoutComponentsCode = `${globalName}.__uniLayout = ${globalName}.__uniLayout || {}\n`
-  windowNames.forEach((name) => {
-    const windowConfig = pagesJson[name]
+  Object.keys(windowNames).forEach((name) => {
+    const windowConfig = pagesJson[name as keyof typeof windowNames]
     if (windowConfig && windowConfig.path) {
       importLayoutComponentsCode += `import ${name} from './${windowConfig.path}'\n`
-      defineLayoutComponentsCode += `${globalName}.__uniConfig.${name}.component = ${name}\n`
+      defineLayoutComponentsCode += `${globalName}.__uniConfig.${name}.component = setupWindow(${name},${
+        windowNames[name as keyof typeof windowNames]
+      })\n`
     }
   })
 

packages/uni-h5/api.ts

@@ -20,6 +20,7 @@ const BLACKLIST = [
   'useTabBar',
   'setupApp',
   'setupPage',
+  'setupWindow',
   'plugin',
   'cssBackdropFilter',
   'cssConstant',

packages/uni-h5/dist/uni-h5.cjs.js

@@ -6834,7 +6834,7 @@ function wrapperComponentSetup(comp, { init, setup, before }) {
     init(instance.proxy);
     const query = setup(instance);
     if (oldSetup) {
-      return oldSetup(query, ctx);
+      return oldSetup(query || props2, ctx);
     }
   };
 }
@@ -6846,6 +6846,18 @@ function setupComponent(comp, options) {
   }
   return comp;
 }
+function setupWindow(comp, id) {
+  return setupComponent(comp, {
+    init: (vm) => {
+      vm.$page = {
+        id
+      };
+    },
+    setup(instance) {
+      instance.root = instance;
+    }
+  });
+}
 function setupPage(comp) {
   return setupComponent(comp, {
     init: initPage,
@@ -10809,5 +10821,6 @@ exports.setStorage = setStorage;
 exports.setStorageSync = setStorageSync;
 exports.setupApp = setupApp;
 exports.setupPage = setupPage;
+exports.setupWindow = setupWindow;
 exports.uni = uni$1;
 exports.useTabBar = useTabBar;

packages/uni-h5/dist/uni-h5.es.js

@@ -13574,7 +13574,7 @@ function wrapperComponentSetup(comp, { init: init2, setup, before }) {
     init2(instance2.proxy);
     const query = setup(instance2);
     if (oldSetup) {
-      return oldSetup(query, ctx);
+      return oldSetup(query || props2, ctx);
     }
   };
 }
@@ -13586,6 +13586,18 @@ function setupComponent(comp, options) {
   }
   return comp;
 }
+function setupWindow(comp, id2) {
+  return setupComponent(comp, {
+    init: (vm) => {
+      vm.$page = {
+        id: id2
+      };
+    },
+    setup(instance2) {
+      instance2.root = instance2;
+    }
+  });
+}
 function setupPage(comp) {
   return setupComponent(comp, {
     init: initPage,
@@ -21155,4 +21167,4 @@ var index = /* @__PURE__ */ defineSystemComponent({
     return openBlock(), createBlock("div", clazz, [loadingVNode]);
   }
 });
-export { $emit, $off, $on, $once, index$1 as AsyncErrorComponent, index as AsyncLoadingComponent, _sfc_main$1 as Audio, index$s as Button, index$q as Canvas, index$o as Checkbox, index$p as CheckboxGroup, index$4 as CoverImage, index$5 as CoverView, index$n as Editor, index$u as Form, index$m as Icon, index$l as Image, Input, index$t as Label, LayoutComponent, Map$1 as Map, MovableArea, MovableView, index$k as Navigator, index$2 as PageComponent, index$3 as Picker, PickerView, PickerViewColumn, index$j as Progress, index$h as Radio, index$i as RadioGroup, ResizeSensor, index$g as RichText, ScrollView, index$f as Slider, Swiper, SwiperItem, index$e as Switch, index$d as Text, index$c as Textarea, UniServiceJSBridge$1 as UniServiceJSBridge, UniViewJSBridge$1 as UniViewJSBridge, index$8 as Video, index$b as View, index$7 as WebView, addInterceptor, addPhoneContact, arrayBufferToBase64, base64ToArrayBuffer, canIUse, canvasGetImageData, canvasPutImageData, canvasToTempFilePath, chooseFile, chooseImage, chooseLocation, chooseVideo, clearStorage, clearStorageSync, closeSocket, connectSocket, createAnimation$1 as createAnimation, createCameraContext, createCanvasContext, createInnerAudioContext, createIntersectionObserver, createLivePlayerContext, createMapContext, createMediaQueryObserver, createSelectorQuery, createVideoContext, cssBackdropFilter, cssConstant, cssEnv, cssVar, downloadFile, getApp$1 as getApp, getCurrentPages$1 as getCurrentPages, getFileInfo, getImageInfo, getLeftWindowStyle, getLocation, getNetworkType, getProvider, getRealPath, getRecorderManager, getRightWindowStyle, getSavedFileInfo, getSavedFileList, getScreenBrightness, getSelectedTextRange$1 as getSelectedTextRange, getStorage, getStorageInfo, getStorageInfoSync, getStorageSync, getSystemInfo, getSystemInfoSync, getTopWindowStyle, getVideoInfo, hideKeyboard, hideLeftWindow, hideLoading, hideNavigationBarLoading, hideRightWindow, hideTabBar, hideTabBarRedDot, hideToast, hideTopWindow, loadFontFace, login, makePhoneCall, navigateBack, navigateTo, offAccelerometerChange, offCompassChange, offNetworkStatusChange, offWindowResize, onAccelerometerChange, onCompassChange, onGyroscopeChange, onMemoryWarning, onNetworkStatusChange, onSocketClose, onSocketError, onSocketMessage, onSocketOpen, onTabBarMidButtonTap, onUserCaptureScreen, onWindowResize, openDocument, openLocation, pageScrollTo, index$9 as plugin, preloadPage, previewImage, promiseInterceptor, reLaunch, redirectTo, removeInterceptor, removeSavedFileInfo, removeStorage, removeStorageSync, removeTabBarBadge, request, saveFile, saveImageToPhotosAlbum, saveVideoToPhotosAlbum, scanCode, sendSocketMessage, setKeepScreenOn, setLeftWindowStyle, setNavigationBarColor, setNavigationBarTitle, setRightWindowStyle, setScreenBrightness, setStorage, setStorageSync, setTabBarBadge, setTabBarItem, setTabBarStyle, setTopWindowStyle, setupApp, setupPage, showActionSheet, showLeftWindow, showLoading, showModal, showNavigationBarLoading, showRightWindow, showTabBar, showTabBarRedDot, showToast, showTopWindow, startAccelerometer, startCompass, startGyroscope, startPullDownRefresh, stopAccelerometer, stopCompass, stopGyroscope, stopPullDownRefresh, switchTab, uni$1 as uni, uploadFile, upx2px, useTabBar, vibrateLong, vibrateShort };
+export { $emit, $off, $on, $once, index$1 as AsyncErrorComponent, index as AsyncLoadingComponent, _sfc_main$1 as Audio, index$s as Button, index$q as Canvas, index$o as Checkbox, index$p as CheckboxGroup, index$4 as CoverImage, index$5 as CoverView, index$n as Editor, index$u as Form, index$m as Icon, index$l as Image, Input, index$t as Label, LayoutComponent, Map$1 as Map, MovableArea, MovableView, index$k as Navigator, index$2 as PageComponent, index$3 as Picker, PickerView, PickerViewColumn, index$j as Progress, index$h as Radio, index$i as RadioGroup, ResizeSensor, index$g as RichText, ScrollView, index$f as Slider, Swiper, SwiperItem, index$e as Switch, index$d as Text, index$c as Textarea, UniServiceJSBridge$1 as UniServiceJSBridge, UniViewJSBridge$1 as UniViewJSBridge, index$8 as Video, index$b as View, index$7 as WebView, addInterceptor, addPhoneContact, arrayBufferToBase64, base64ToArrayBuffer, canIUse, canvasGetImageData, canvasPutImageData, canvasToTempFilePath, chooseFile, chooseImage, chooseLocation, chooseVideo, clearStorage, clearStorageSync, closeSocket, connectSocket, createAnimation$1 as createAnimation, createCameraContext, createCanvasContext, createInnerAudioContext, createIntersectionObserver, createLivePlayerContext, createMapContext, createMediaQueryObserver, createSelectorQuery, createVideoContext, cssBackdropFilter, cssConstant, cssEnv, cssVar, downloadFile, getApp$1 as getApp, getCurrentPages$1 as getCurrentPages, getFileInfo, getImageInfo, getLeftWindowStyle, getLocation, getNetworkType, getProvider, getRealPath, getRecorderManager, getRightWindowStyle, getSavedFileInfo, getSavedFileList, getScreenBrightness, getSelectedTextRange$1 as getSelectedTextRange, getStorage, getStorageInfo, getStorageInfoSync, getStorageSync, getSystemInfo, getSystemInfoSync, getTopWindowStyle, getVideoInfo, hideKeyboard, hideLeftWindow, hideLoading, hideNavigationBarLoading, hideRightWindow, hideTabBar, hideTabBarRedDot, hideToast, hideTopWindow, loadFontFace, login, makePhoneCall, navigateBack, navigateTo, offAccelerometerChange, offCompassChange, offNetworkStatusChange, offWindowResize, onAccelerometerChange, onCompassChange, onGyroscopeChange, onMemoryWarning, onNetworkStatusChange, onSocketClose, onSocketError, onSocketMessage, onSocketOpen, onTabBarMidButtonTap, onUserCaptureScreen, onWindowResize, openDocument, openLocation, pageScrollTo, index$9 as plugin, preloadPage, previewImage, promiseInterceptor, reLaunch, redirectTo, removeInterceptor, removeSavedFileInfo, removeStorage, removeStorageSync, removeTabBarBadge, request, saveFile, saveImageToPhotosAlbum, saveVideoToPhotosAlbum, scanCode, sendSocketMessage, setKeepScreenOn, setLeftWindowStyle, setNavigationBarColor, setNavigationBarTitle, setRightWindowStyle, setScreenBrightness, setStorage, setStorageSync, setTabBarBadge, setTabBarItem, setTabBarStyle, setTopWindowStyle, setupApp, setupPage, setupWindow, showActionSheet, showLeftWindow, showLoading, showModal, showNavigationBarLoading, showRightWindow, showTabBar, showTabBarRedDot, showToast, showTopWindow, startAccelerometer, startCompass, startGyroscope, startPullDownRefresh, stopAccelerometer, stopCompass, stopGyroscope, stopPullDownRefresh, switchTab, uni$1 as uni, uploadFile, upx2px, useTabBar, vibrateLong, vibrateShort };

packages/uni-h5/lib/resolve-id.js

-/**
- * @type {import('vite').Plugin}
- */
-const UniH5ResolveIdPlugin = {
-  name: 'vite:uni-h5-resolve-id',
-  resolveId(id) {
-    if (id === 'vue') {
-      id = '@dcloudio/uni-h5-vue'
-    }
-    const cache = resolveCache[id]
-    if (cache) {
-      return cache
-    }
-
-    for (const { test, resolveId } of resolvedIds) {
-      if (!test(id)) {
-        continue
-      }
-      const file = resolveId(id)
-      if (!file) {
-        continue
-      }
-      resolveCache[id] = file
-      debugResolve(id, file)
-      return file
-    }
-  },
-}

packages/uni-h5/lib/uni.plugin.js

-/**
- * @type {import('vite').Plugin}
- */
-const UniH5Plugin = {
-  name: 'vite:uni-h5',
-  uni: {
-    transformEvent: {
-      tap: 'click',
-    },
-  },
-}
-
-module.exports = UniH5Plugin

packages/uni-h5/package.json

@@ -6,7 +6,6 @@
   "module": "./dist/uni-h5.es.js",
   "files": [
     "dist",
-    "lib",
     "style"
   ],
   "sideEffects": false,

packages/uni-h5/src/framework/setup/index.ts

@@ -30,7 +30,7 @@ import { usePageMeta, usePageRoute } from './provide'
 
 interface SetupComponentOptions {
   init: (vm: ComponentPublicInstance) => void
-  setup: (instance: ComponentInternalInstance) => Record<string, any>
+  setup: (instance: ComponentInternalInstance) => Record<string, any> | void
   before?: (comp: DefineComponent) => void
 }
 
@@ -45,7 +45,7 @@ function wrapperComponentSetup(
     init(instance.proxy!)
     const query = setup(instance)
     if (oldSetup) {
-      return oldSetup(query, ctx)
+      return oldSetup(query || props, ctx)
     }
   }
 }
@@ -59,11 +59,24 @@ function setupComponent(comp: any, options: SetupComponentOptions) {
   return comp
 }
 
+export function setupWindow(comp: any, id: number) {
+  return setupComponent(comp, {
+    init: (vm) => {
+      vm.$page = {
+        id,
+      } as Page.PageInstance['$page']
+    },
+    setup(instance) {
+      instance.root = instance // windows 中组件 root 指向 window
+    },
+  })
+}
+
 export function setupPage(comp: any) {
   return setupComponent(comp, {
     init: initPage,
     setup(instance) {
-      instance.root = instance // 组件root指向页面
+      instance.root = instance // 组件 root 指向页面
       const route = usePageRoute()
       // node环境不触发Page生命周期
       if (__NODE_JS__) {