fix: types

tarojsx · May 1, 2020 · 1b3c32f · 1b3c32f
1 parent 011c094
commit 1b3c32f
Show file tree

Hide file tree

Showing 2 changed files with 70 additions and 36 deletions.
diff --git a/src/ImagePicker.tsx b/src/ImagePicker.tsx
@@ -46,7 +46,7 @@ export interface ImagePickerProps {
     onFail?: (message: string) => void
 }
 
-export const ImagePicker: React.FC<ImagePickerProps> = props => {
+export const ImagePicker: React.FC<ImagePickerProps> = (props) => {
     const {
         className,
         style = {},
@@ -92,7 +92,7 @@ export const ImagePicker: React.FC<ImagePickerProps> = props => {
 
     const chooseFile = useCallback(async () => {
         const filePathName = process.env.TARO_ENV === 'alipay' ? 'apFilePaths' : 'tempFiles'
-        const params = {} as Taro.chooseImage.Param
+        const params = {} as Taro.chooseImage.Option
         if (multiple) {
             params.count = 99
         }
@@ -150,7 +150,7 @@ export const ImagePicker: React.FC<ImagePickerProps> = props => {
                                 <View className="at-image-picker__item">
                                     <View
                                         className="at-image-picker__remove-btn"
-                                        onClick={e => {
+                                        onClick={(e) => {
                                             e.stopPropagation()
                                             handleImageRemove(i * length + j)
                                         }}
@@ -168,7 +168,7 @@ export const ImagePicker: React.FC<ImagePickerProps> = props => {
                                 {item.type === 'btn' && (
                                     <View
                                         className="at-image-picker__item at-image-picker__choose-btn"
-                                        onClick={e => {
+                                        onClick={(e) => {
                                             e.stopPropagation()
                                             chooseFile()
                                         }}

diff --git a/src/utils.ts b/src/utils.ts
@@ -1,59 +1,52 @@
 import Taro from '@tarojs/taro'
-import { execObject, SelectorQuery } from '@tarojs/taro/types/index'
+import { SelectorQuery } from '@tarojs/taro/types/index'
 
 const ENV = Taro.getEnv()
 
-function delay(delayTime = 500): Promise<null> {
-    return new Promise(resolve => {
-        if ([Taro.ENV_TYPE.WEB, Taro.ENV_TYPE.SWAN].includes(ENV)) {
-            setTimeout(() => {
-                resolve()
-            }, delayTime)
-            return
-        }
-        resolve()
+function delay(delayTime = 25): Promise<null> {
+    return new Promise((resolve) => {
+        setTimeout(() => {
+            resolve()
+        }, delayTime)
     })
 }
 
-function delayQuerySelector(self, selectorStr: string, delayTime = 500): Promise<Array<execObject>> {
-    const $scope = ENV === Taro.ENV_TYPE.WEB ? self : self.$scope
-    const selector: SelectorQuery = Taro.createSelectorQuery().in($scope)
-
-    return new Promise(resolve => {
+function delayQuerySelector(selectorStr: string, delayTime = 500): Promise<any[]> {
+    return new Promise((resolve) => {
+        const selector: SelectorQuery = Taro.createSelectorQuery()
         delay(delayTime).then(() => {
             selector
                 .select(selectorStr)
                 .boundingClientRect()
-                .exec((res: Array<execObject>) => {
+                .exec((res: any[]) => {
                     resolve(res)
                 })
         })
     })
 }
 
-function delayGetScrollOffset({ delayTime = 500 }): Promise<Array<execObject>> {
-    return new Promise(resolve => {
+function delayGetScrollOffset({ delayTime = 500 }): Promise<any[]> {
+    return new Promise((resolve) => {
         delay(delayTime).then(() => {
             Taro.createSelectorQuery()
                 .selectViewport()
                 .scrollOffset()
-                .exec((res: Array<execObject>) => {
+                .exec((res: any[]) => {
                     resolve(res)
                 })
         })
     })
 }
 
-function delayGetClientRect({ self, selectorStr, delayTime = 500 }): Promise<Array<execObject>> {
-    const $scope = ENV === Taro.ENV_TYPE.WEB || ENV === Taro.ENV_TYPE.SWAN ? self : self.$scope
-    const selector: SelectorQuery = Taro.createSelectorQuery().in($scope)
+function delayGetClientRect({ selectorStr, delayTime = 500 }): Promise<any[]> {
+    const selector: SelectorQuery = Taro.createSelectorQuery()
 
-    return new Promise(resolve => {
+    return new Promise((resolve) => {
         delay(delayTime).then(() => {
             selector
                 .select(selectorStr)
                 .boundingClientRect()
-                .exec((res: Array<execObject>) => {
+                .exec((res: any[]) => {
                     resolve(res)
                 })
         })
@@ -102,7 +95,7 @@ interface EventDetail {
     y: number
 }
 
-function getEventDetail(event: any) {
+function getEventDetail(event: any): EventDetail {
     let detail: EventDetail
     switch (ENV) {
         case Taro.ENV_TYPE.WEB:
@@ -174,19 +167,26 @@ function getEventDetail(event: any) {
     return detail
 }
 
-function initTestEnv() {
+function initTestEnv(): void {
     if (process.env.NODE_ENV === 'test') {
-        Taro.initPxTransform({ designWidth: 750 } as any)
+        Taro.initPxTransform({
+            designWidth: 750,
+            deviceRatio: {
+                '640': 2.34 / 2,
+                '750': 1,
+                '828': 1.81 / 2,
+            },
+        })
     }
 }
 
-function isTest() {
+function isTest(): boolean {
     return process.env.NODE_ENV === 'test'
 }
 
 let scrollTop = 0
 
-function handleTouchScroll(flag) {
+function handleTouchScroll(flag: any): void {
     if (ENV !== Taro.ENV_TYPE.WEB) {
         return
     }
@@ -199,16 +199,49 @@ function handleTouchScroll(flag) {
         // 把脱离文档流的body拉上去！否则页面会回到顶部！
         document.body.style.top = `${-scrollTop}px`
     } else {
-        document.body.style.top = null
+        document.body.style.top = ''
         document.body.classList.remove('at-frozen')
 
         document.documentElement.scrollTop = scrollTop
     }
 }
 
-function pxTransform(size) {
+function pxTransform(size: number): string {
     if (!size) return ''
-    return Taro.pxTransform(size)
+    const designWidth = 750
+    const deviceRatio = {
+        640: 2.34 / 2,
+        750: 1,
+        828: 1.81 / 2,
+    }
+    return `${size / deviceRatio[designWidth]}rpx`
+}
+
+function objectToString(style: object | string): string {
+    if (style && typeof style === 'object') {
+        let styleStr = ''
+        Object.keys(style).forEach((key) => {
+            const lowerCaseKey = key.replace(/([A-Z])/g, '-$1').toLowerCase()
+            styleStr += `${lowerCaseKey}:${style[key]};`
+        })
+        return styleStr
+    } else if (style && typeof style === 'string') {
+        return style
+    }
+    return ''
+}
+
+/**
+ * 合并 style
+ * @param {Object|String} style1
+ * @param {Object|String} style2
+ * @returns {String}
+ */
+function mergeStyle(style1: object | string, style2: object | string): object | string {
+    if (style1 && typeof style1 === 'object' && style2 && typeof style2 === 'object') {
+        return Object.assign({}, style1, style2)
+    }
+    return objectToString(style1) + objectToString(style2)
 }
 
 export {
@@ -222,4 +255,5 @@ export {
     handleTouchScroll,
     delayGetClientRect,
     delayGetScrollOffset,
+    mergeStyle,
 }