feat: 实现窗口相关API：uni.onWindowResize、uni.offWindowResize #133

src/platforms/h5/components/app/index.vue

@@ -6,21 +6,21 @@
       <router-view :key="key" />
     </keep-alive>
     <!-- </transition> -->
-    <tab-bar
-      v-if="hasTabBar"
-      v-show="showTabBar"
+    <tab-bar
+      v-if="hasTabBar"
+      v-show="showTabBar"
       v-bind="tabBar" />
-    <toast
-      v-bind="showToast"
+    <toast
+      v-bind="showToast"
       @close="_onModalClose" />
-    <action-sheet
-      v-bind="showActionSheet"
+    <action-sheet
+      v-bind="showActionSheet"
       @close="_onActionSheetClose" />
-    <modal
-      v-bind="showModal"
+    <modal
+      v-bind="showModal"
       @close="_onModalClose" />
-    <picker
-      v-bind="showPicker"
+    <picker
+      v-bind="showPicker"
       @close="_onPickerClose" />
   </uni-app>
 </template>
@@ -78,6 +78,8 @@ export default {
         document.documentElement.style.setProperty('--window-bottom', windowBottom)
         console.debug(`uni.${windowBottom ? 'showTabBar' : 'hideTabBar'}：--window-bottom=${windowBottom}`)
       }
+      // 触发 resize 事件
+      window.dispatchEvent(new CustomEvent('resize'))
     }
   },
   created () {
@@ -111,4 +113,4 @@ export default {
 		width: 100%;
 		height: 100%;
 	}
-</style>
+</style>

src/platforms/h5/service/api/window.js

+const callbacks = []
+
+function onResize () {
+  const {
+    invokeCallbackHandler: invoke
+  } = UniServiceJSBridge
+  callbacks.forEach(callbackId => {
+    const {
+      windowWidth,
+      windowHeight,
+      screenWidth,
+      screenHeight
+    } = uni.getSystemInfoSync()
+    var landscape = typeof window.orientation === 'number' ? Math.abs(window.orientation) === 90 : screenWidth / screenHeight > 1
+    var deviceOrientation = landscape ? 'landscape' : 'portrait'
+
+    invoke(callbackId, {
+      deviceOrientation,
+      size: {
+        windowWidth,
+        windowHeight,
+        screenWidth,
+        screenHeight
+      }
+    })
+  })
+}
+/**
+ * 监听窗口大小变化
+ * @param {*} callbackId
+ */
+export function onWindowResize (callbackId) {
+  if (!callbacks.length) {
+    window.addEventListener('resize', onResize)
+  }
+  callbacks.push(callbackId)
+}
+/**
+ * 取消监听窗口大小变化
+ * @param {*} callbackId
+ */
+export function offWindowResize (callbackId) {
+  var index = callbacks.indexOf(callbackId)
+  // 此处和微信平台一致查询不到去掉最后一个
+  if (index >= 0) {
+    callbacks.splice(index, 1)
+  } else {
+    callbacks.pop()
+  }
+  if (!callbacks.length) {
+    window.removeEventListener('resize', onResize)
+  }
+}