@mpxjs/api-proxy 2.9.52 → 2.9.58

package/src/platform/api/create-selector-query/rnNodesRef.js

@@ -0,0 +1,262 @@
+import {
+  noop,
+  isBoolean,
+  dash2hump,
+  collectDataset,
+  hump2dash,
+  isArray
+} from '@mpxjs/utils'
+import { StyleSheet } from 'react-native'
+
+const flushRefFns = (nodeInstances, fns, single) => {
+  // wx的数据格式：对于具体方法接受到的回调传参，如果获取的 nodeRef 只有一个，那么只需要返回一条数据而不是数组，但是 exec 里面统一都是数组
+  const mountedNodeInstance = nodeInstances
+    .map((instance) => instance.getNodeInstance())
+    .filter(({ nodeRef }) => nodeRef.current) // 如果有 nodeRef，表明目前组件处于挂载中
+  if (mountedNodeInstance.length) {
+    return Promise.all(
+      mountedNodeInstance.map((instance) => flushFns(instance, fns))
+    ).then((result = []) => (single ? result[0] : result))
+  } else {
+    return Promise.resolve(single ? null : [])
+  }
+}
+
+const flushFns = (nodeInstance, fns) => {
+  return Promise.all(fns.map((fn) => fn(nodeInstance))).then((res) => {
+    return res.reduce((preVal, curVal) => {
+      return Object.assign(preVal, curVal)
+    }, {})
+  })
+}
+
+const wrapFn = (fn) => {
+  return (nodeRef) => {
+    return new Promise((resolve) => {
+      fn(nodeRef, resolve)
+    })
+  }
+}
+
+const getMeasureProps = (measureProps = []) => {
+  return wrapFn((nodeInstance, resolve) => {
+    const nodeRef = nodeInstance.nodeRef.current
+    setTimeout(() => {
+      nodeRef.measure(function (x, y, width, height, pageX, pageY) {
+        const rectAndSize = {
+          width,
+          height,
+          left: pageX,
+          top: pageY,
+          right: pageX + width,
+          bottom: pageY + height
+        }
+        const result = measureProps.reduce((preVal, key) => {
+          return Object.assign(preVal, { [key]: rectAndSize[key] || 0 })
+        }, {})
+        resolve(result)
+      })
+    }, 30) // 延迟，等待组件在rn视图上真正渲染出来
+  })
+}
+
+const getDataset = (props) => {
+  return wrapFn((nodeRef, resolve) => {
+    props = nodeRef.props.current
+    resolve({
+      dataset: collectDataset(props)
+    })
+  })
+}
+
+const getPlainProps = (config) => {
+  return wrapFn((nodeRef, resolve) => {
+    const res = {}
+    const props = nodeRef.props.current
+    config.forEach((key) => {
+      // props 属性默认不转驼峰，用户写什么格式不会变化，取值做兼容
+      res[key] = props[key] || props[hump2dash(key)] || ''
+    })
+    resolve(res)
+  })
+}
+
+const getComputedStyle = (config = []) => {
+  return wrapFn((nodeRef, resolve) => {
+    config = new Set(config)
+    const res = {}
+    const styles = nodeRef.props.current.style || []
+    const defaultStyle = nodeRef.instance.defaultStyle || {}
+    const computedStyle = StyleSheet.flatten([defaultStyle, ...styles])
+    config.forEach((key) => {
+      const humpKey = dash2hump(key)
+      // 取 style 的 key 是根据传入的 key 来设置，传什么设置什么 key，只不过取值需要做兼容
+      res[key] = computedStyle[key] || computedStyle[humpKey] || ''
+    })
+
+    resolve(res)
+  })
+}
+
+const getInstanceConfig = (config) => {
+  return wrapFn((nodeRef, resolve) => {
+    const instance = nodeRef.instance
+    resolve({ [config]: instance[config] || {} })
+  })
+}
+
+const defaultScrollOffset = {
+  scrollLeft: 0,
+  scrollTop: 0,
+  scrollHeight: 0,
+  scrollWidth: 0
+}
+
+const getScrollOffset = () => {
+  return wrapFn((nodeRef, resolve) => {
+    const instance = nodeRef.instance
+    resolve(
+      (instance.scrollOffset && instance.scrollOffset.current) ||
+        defaultScrollOffset
+    )
+  })
+}
+
+const RECT = ['left', 'top', 'right', 'bottom']
+const SIZE = ['width', 'height']
+
+class NodeRef {
+  constructor (nodeRefs = [], selectorQuery, single) {
+    if (!isArray(nodeRefs)) {
+      nodeRefs = [nodeRefs]
+    }
+    this.nodeRefs = nodeRefs
+    this.selectorQuery = selectorQuery
+    this.single = single
+  }
+
+  fields (config, cb = noop) {
+    const plainProps = []
+    const measureProps = []
+    const computedStyle = []
+    const fns = []
+
+    for (const key in config) {
+      const value = config[key]
+      if (Array.isArray(value) && value.length) {
+        if (key === 'properties') {
+          // wx 最终输出的 properties 字段都会转化为驼峰，所以在这里提前处理为最终的字段格式
+          plainProps.push(...value.map((v) => dash2hump(v)))
+        } else if (key === 'computedStyle') {
+          const _computedStyle = config.computedStyle
+          for (let i = _computedStyle.length - 1; i >= 0; i--) {
+            const style = _computedStyle[i]
+            if (RECT.includes(style) || SIZE.includes(style)) {
+              measureProps.push(style)
+              _computedStyle.splice(i, 1)
+            }
+          }
+          if (_computedStyle.length) {
+            computedStyle.push(..._computedStyle)
+          }
+        }
+      } else if (isBoolean(value) && value) {
+        switch (key) {
+          case 'rect':
+            measureProps.push(...RECT)
+            break
+          case 'size':
+            measureProps.push(...SIZE)
+            break
+          case 'scrollOffset':
+            fns.push(getScrollOffset())
+            break
+          case 'dataset':
+            fns.push(getDataset())
+            break
+          case 'node':
+          case 'context':
+          case 'ref':
+            fns.push(getInstanceConfig(key))
+            break
+          default:
+            plainProps.push(key)
+            break
+        }
+      }
+    }
+
+    if (plainProps.length) {
+      fns.push(getPlainProps(plainProps))
+    }
+    if (measureProps.length) {
+      const nodeInstance =
+        this.nodeRefs[0] && this.nodeRefs[0].getNodeInstance()
+      const hasMeasureFn =
+        nodeInstance &&
+        nodeInstance.nodeRef.current &&
+        nodeInstance.nodeRef.current.measure
+      if (hasMeasureFn) {
+        fns.push(getMeasureProps(measureProps))
+      } else {
+        computedStyle.push(...measureProps)
+      }
+    }
+    if (computedStyle.length) {
+      fns.push(getComputedStyle(computedStyle))
+    }
+
+    const runCb = () => {
+      return flushRefFns(this.nodeRefs, fns, this.single).then((result) => {
+        cb(result)
+        return result
+      })
+    }
+
+    this.selectorQuery._queueCb.push(runCb)
+
+    return this.selectorQuery
+  }
+
+  boundingClientRect (cb = noop) {
+    const config = {
+      id: true,
+      dataset: true,
+      rect: true,
+      size: true
+    }
+    return this.fields(config, cb)
+  }
+
+  context (cb = noop) {
+    const config = {
+      context: true
+    }
+    return this.fields(config, cb)
+  }
+
+  node (cb = noop) {
+    const config = {
+      node: true
+    }
+    return this.fields(config, cb)
+  }
+
+  ref (cb = noop) {
+    const config = {
+      ref: true
+    }
+    return this.fields(config, cb)
+  }
+
+  scrollOffset (cb = noop) {
+    const config = {
+      id: true,
+      dataset: true,
+      scrollOffset: true
+    }
+    return this.fields(config, cb)
+  }
+}
+
+export default NodeRef

package/src/platform/api/create-selector-query/rnSelectQuery.js

@@ -0,0 +1,43 @@
+import NodeRef from './rnNodesRef'
+import { warn, noop } from '@mpxjs/utils'
+
+export default class SelectorQuery {
+  constructor () {
+    this._component = null
+    this._queue = []
+    this._queueCb = []
+  }
+
+  // wx 目前 exec 方法返回 undefined，文档上标注的是 NodeRef 类型，按实际的返回值来实现
+  exec (cb = noop) {
+    Promise.all(this._queueCb.map((cb) => cb())).then((res) => cb(res))
+  }
+
+  in (component) {
+    this._component = component
+    return this
+  }
+
+  /**
+   * 目前支持的 selector
+   *
+   * 1. id 选择器：#the-id
+   * 2. class 选择器（可以连续指定多个）：.a-class.another-class
+   */
+  select (selector = '', all) {
+    if (!this._component) {
+      warn('Please use SelectorQuery.in method to set context')
+    }
+    const refs = this._component && this._component.__selectRef(selector, 'node', all)
+    return new NodeRef(refs, this, !all)
+  }
+
+  selectAll (selector) {
+    return this.select(selector, true)
+  }
+
+  selectViewport () {
+    // todo rn 这块实现不了
+    return this.select('')
+  }
+}

package/src/platform/api/device/network/getNetworkType.js

@@ -1,4 +1,4 @@
-import { webHandleSuccess, webHandleFail, isBrowser, throwSSRWarning } from '../../../../common/js'
+import { successHandle, failHandle, isBrowser, throwSSRWarning } from '../../../../common/js'
 
 export function getNetworkType ({ success, fail = () => {}, complete = () => {} } = {}) {
   if (!isBrowser) {
@@ -7,11 +7,11 @@ export function getNetworkType ({ success, fail = () => {}, complete = () => {}
   }
   try {
     if (navigator.connection) {
-      webHandleSuccess({ networkType: navigator.connection.effectiveType }, success, complete)
+      successHandle({ networkType: navigator.connection.effectiveType }, success, complete)
     } else {
-      webHandleSuccess({ networkType: 'unknown' }, success, complete)
+      successHandle({ networkType: 'unknown' }, success, complete)
     }
   } catch (err) {
-    webHandleFail(err, fail, complete)
+    failHandle(err, fail, complete)
   }
 }

package/src/platform/api/device/network/rnNetwork.js

@@ -1,4 +1,4 @@
-import { webHandleSuccess, webHandleFail, defineUnsupportedProps } from '../../../../common/js'
+import { successHandle, failHandle, defineUnsupportedProps } from '../../../../common/js'
 import NetInfo, { NetInfoStateType } from '@react-native-community/netinfo'
 
 let _unsubscribe = null
@@ -21,12 +21,12 @@ const getNetworkType = function (options) {
       errMsg: 'getNetworkType:ok'
     }
     defineUnsupportedProps(result, ['signalStrength', 'hasSystemProxy'])
-    webHandleSuccess(result, success, complete)
+    successHandle(result, success, complete)
   }).catch((err) => {
     const result = {
       errMsg: err.message
     }
-    webHandleFail(result, fail, complete)
+    failHandle(result, fail, complete)
   })
 }
 

package/src/platform/api/image/Preview.js

@@ -1,4 +1,4 @@
-import { webHandleSuccess, webHandleFail, createDom, warn, bindTap, getRootElement } from '../../../common/js'
+import { successHandle, failHandle, createDom, warn, bindTap, getRootElement } from '../../../common/js'
 import '../../../common/stylus/Preview.styl'
 /**
  * Preview class for displaying images in a slideshow format.
@@ -67,9 +67,9 @@ export default class Preview {
       }))))
       this.maxIndex = urls.length
       this.updateTextTip()
-      webHandleSuccess({ errMsg: 'previewImage:ok' }, success, complete)
+      successHandle({ errMsg: 'previewImage:ok' }, success, complete)
     } catch (e) {
-      webHandleFail({ errMsg: 'previewImage:fail', err: e }, fail, complete)
+      failHandle({ errMsg: 'previewImage:fail', err: e }, fail, complete)
     }
   }
 

package/src/platform/api/location/index.ali.js

@@ -0,0 +1,31 @@
+import { ENV_OBJ, changeOpts, handleSuccess, defineUnsupportedProps } from '../../../common/js'
+
+function getLocation (options = {}) {
+  const opts = Object.assign(options, {
+    type: 0 // 只获取经纬与微信拉齐
+  })
+  handleSuccess(opts, res => {
+    const result = changeOpts(
+      res,
+      { errMsg: 'getLocation:ok' }
+    )
+    defineUnsupportedProps(result, ['speed'])
+    return result
+  })
+  return ENV_OBJ.getLocation(opts)
+}
+
+function openLocation (options = {}) {
+  const opts = Object.assign({
+    scale: 15 // 地图缩放比例兜底值
+  }, options)
+  return ENV_OBJ.openLocation(opts)
+}
+
+const chooseLocation = ENV_OBJ.chooseLocation
+
+export {
+  getLocation,
+  openLocation,
+  chooseLocation
+}

package/src/platform/api/location/index.android.js

@@ -0,0 +1 @@
+export * from './index.ios'

package/src/platform/api/location/index.ios.js

@@ -0,0 +1,31 @@
+import GetLocation from 'react-native-get-location'
+import { envError, successHandle, failHandle, defineUnsupportedProps } from '../../../common/js'
+
+const getLocation = function (options) {
+  const { isHighAccuracy = false, success, fail, complete } = options
+  GetLocation.getCurrentPosition({
+    enableHighAccuracy: isHighAccuracy
+  }).then(location => {
+    Object.assign(location, {
+      errMsg: 'getLocation:ok'
+    })
+    defineUnsupportedProps(location, ['horizontalAccuracy'])
+    successHandle(location, success, complete)
+  })
+  .catch(error => {
+    const result = {
+      errMsg: `getLocation:fail ${error}`
+    }
+    failHandle(result, fail, complete)
+  })
+}
+
+const openLocation = envError('openLocation')
+
+const chooseLocation = envError('chooseLocation')
+
+export {
+  getLocation,
+  openLocation,
+  chooseLocation
+}

package/src/platform/api/location/index.js

@@ -0,0 +1,13 @@
+import { ENV_OBJ, envError } from '../../../common/js'
+
+const getLocation = ENV_OBJ.getLocation || envError('getLocation')
+
+const openLocation = ENV_OBJ.openLocation || envError('openLocation')
+
+const chooseLocation = ENV_OBJ.chooseLocation || envError('chooseLocation')
+
+export {
+  getLocation,
+  openLocation,
+  chooseLocation
+}

package/src/platform/api/location/index.web.js

@@ -0,0 +1,36 @@
+import { envError, successHandle, failHandle, defineUnsupportedProps } from '../../../common/js'
+
+const getLocation = function (options) {
+  const { isHighAccuracy = false, success, fail, complete } = options
+  if (navigator.geolocation.getCurrentPosition) {
+    navigator.geolocation.getCurrentPosition((res = {}) => {
+      const coords = res.coords || {}
+      const result = {
+        accuracy: coords.accuracy,
+        errMsg: 'getLocation:ok',
+        latitude: coords.latitude,
+        longitude: coords.longitude,
+        speed: coords.accuracy
+      }
+      defineUnsupportedProps(result, ['horizontalAccuracy', 'verticalAccuracy'])
+      successHandle(result, success, complete)
+    }, (err) => {
+      const result = {
+        errMsg: `getLocation:fail ${err}`
+      }
+      failHandle(result, fail, complete)
+    }, {
+      enableHighAccuracy: isHighAccuracy
+    })
+  }
+}
+
+const openLocation = envError('openLocation')
+
+const chooseLocation = envError('chooseLocation')
+
+export {
+  getLocation,
+  openLocation,
+  chooseLocation
+}

package/src/platform/api/make-phone-call/rnMakePhone.js

@@ -1,4 +1,4 @@
-import { webHandleSuccess, webHandleFail } from '../../../common/js'
+import { successHandle, failHandle } from '../../../common/js'
 import { Linking } from 'react-native'
 
 const makePhoneCall = function (options) {
@@ -13,12 +13,12 @@ const makePhoneCall = function (options) {
     const result = {
       errMsg: 'makePhoneCall:ok'
     }
-    webHandleSuccess(result, success, complete)
+    successHandle(result, success, complete)
   }).catch(() => {
     const result = {
       errMsg: 'makePhoneCall:fail cancel'
     }
-    webHandleFail(result, fail, complete)
+    failHandle(result, fail, complete)
   })
 }
 

package/src/platform/api/modal/Modal.js

@@ -1,4 +1,4 @@
-import { createDom, getRootElement, webHandleSuccess } from '../../../common/js'
+import { createDom, getRootElement, successHandle, failHandle } from '../../../common/js'
 import '../../../common/stylus/Modal.styl'
 // import { forEach } from '@didi/mpx-fetch/src/util'
 // 汉字为两个字符，字母/数字为一个字符
@@ -23,9 +23,9 @@ export default class Modal {
       cancelColor: '#000000',
       confirmText: '确定',
       confirmColor: '#576B95',
-      success: (...args) => {},
-      fail: (...args) => {},
-      complete: (...args) => {}
+      success: (...args) => { },
+      fail: (...args) => { },
+      complete: (...args) => { }
     }
 
     this.hideTimer = null
@@ -44,21 +44,18 @@ export default class Modal {
   }
 
   show (options = {}) {
-    getRootElement().appendChild(this.modal)
-    if (options.confirmText && _getLength(options.confirmText) > 8) {
-      // eslint-disable-next-line
-      return Promise.reject({errMsg: 'showModal:fail confirmText length should not larger than 4 Chinese characters'})
+    const opts = Object.assign({}, this.defaultOpts, options)
+    if (opts.confirmText && _getLength(opts.confirmText) > 8) {
+      return failHandle({ errMsg: 'showModal:fail confirmText length should not larger than 4 Chinese characters' }, opts.fail, opts.complete)
     }
-    if (options.cancelText && _getLength(options.cancelText) > 8) {
-      // eslint-disable-next-line
-      return Promise.reject({errMsg: 'showModal:fail cancelText length should not larger than 4 Chinese characters'})
+    if (opts.cancelText && _getLength(opts.cancelText) > 8) {
+      return failHandle({ errMsg: 'showModal:fail cancelText length should not larger than 4 Chinese characters' }, opts.fail, opts.complete)
     }
+    getRootElement().appendChild(this.modal)
     if (this.hideTimer) {
       clearTimeout(this.hideTimer)
       this.hideTimer = null
     }
-    const opts = Object.assign({}, this.defaultOpts, options)
-
     this.title.textContent = opts.title
     this.content.textContent = opts.content
 
@@ -80,7 +77,7 @@ export default class Modal {
         cancel: true,
         confirm: false
       }
-      webHandleSuccess(result, opts.success, opts.complete)
+      successHandle(result, opts.success, opts.complete)
     }
     this.confirmBtn.onclick = () => {
       this.hide()
@@ -89,7 +86,7 @@ export default class Modal {
         cancel: false,
         confirm: true
       }
-      webHandleSuccess(result, opts.success, opts.complete)
+      successHandle(result, opts.success, opts.complete)
     }
 
     this.modal.classList.add('show')

package/src/platform/api/modal/index.android.js

@@ -0,0 +1 @@
+export * from './rnModal'

package/src/platform/api/modal/index.ios.js

@@ -0,0 +1 @@
+export * from './rnModal'