详解微信小程序 同步异步解决办法

详解微信小程序 同步异步解决办法

小程序中函数体还没有完成，下一个函数就开始执行了,而且两个函数之间需要传参。那是因为微信小程序函数是异步执行的。但微信小程序增加了ES6的promise特性支持，微信小程序新版本中移除了promise的支持，需要自己使用第三方库来自行实现ES6的promise特性。

WxService.js

import Tools from 'Tools'
import es6 from '../assets/plugins/es6-promise'

class Service {
constructor() {
 this.__init()
}

/**
 * __init
 */
__init() {
 this.tools = new Tools
 this.__initDefaults()
 this.__initMethods()
}

/**
 * __initDefaults
 */
__initDefaults() {
 // 缓存非异步方法
 this.noPromiseMethods = [
  'stopRecord',
  'pauseVoice',
  'stopVoice',
  'pauseBackgroundAudio',
  'stopBackgroundAudio',
  'showNavigationBarLoading',
  'hideNavigationBarLoading',
  'createAnimation',
  'createContext',
  'hideKeyboard',
  'stopPullDownRefresh',
 ]

// 缓存wx接口方法名
 this.instanceSource = {
  method: Object.keys(wx)
 }
}

/**
 * 遍历wx方法对象，判断是否为异步方法，是则构造promise
 */
__initMethods() {
 for (let key in this.instanceSource) {
  this.instanceSource[key].forEach((method, index) => {
   this[method] = (...args) => {
    // 判断是否为非异步方法或以 wx.on 开头，或以 Sync 结尾的方法
    if (this.noPromiseMethods.indexOf(method) !== -1 || method.substr(0, 2) === 'on' || /\w+Sync$/.test(method)) {
     return wx[method](...args)
    }
    return this.__defaultRequest(method, ...args)
   }
  })
 }

/**
    * 保留当前页面，跳转到应用内的某个页面
    * @param {String} url 路径
    * @param {Object} params 参数
    */
 this.navigateTo = (url, params) => {
  const $$url = this.tools.buildUrl(url, params)
  return new es6.Promise((resolve, reject) => {
   wx.navigateTo({
    url: $$url,
    success: res => resolve(res),
    fail: res => reject(res),
   })
  })
 }

/**
 * 关闭当前页面，跳转到应用内的某个页面
 * @param {String} url 路径
 * @param {Object} params 参数
 */
 this.redirectTo = (url, params) => {
  const $$url = this.tools.buildUrl(url, params)
  return new es6.Promise((resolve, reject) => {
   wx.redirectTo({
    url: $$url,
    success: res => resolve(res),
    fail: res => reject(res),
   })
  })
 }
}

/**
 * 以wx下API作为底层方法
 * @param {String} method 方法名
 * @param {Object} obj  接收参数
 */
__defaultRequest(method = '', obj = {}) {
 return new es6.Promise((resolve, reject) => {
  obj.success = (res) => resolve(res)
  obj.fail = (res) => reject(res)
  wx[method](obj)
 })
}
}

export default Service

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

来源：http://blog.csdn.net/xiaochun365/article/details/72480790