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

 更新时间:2017年06月23日 11:33:11   作者:xiaochun365  
这篇文章主要介绍了详解微信小程序 同步异步解决办法的相关资料,需要的朋友可以参考下

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

小程序中函数体还没有完成,下一个函数就开始执行了,而且两个函数之间需要传参。那是因为微信小程序函数是异步执行的。但微信小程序增加了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

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

相关文章

  • Java 的抽象类原理与用法分析

    Java 的抽象类原理与用法分析

    这篇文章主要介绍了Java 的抽象类原理与用法,结合实例形式分析了java抽象类与接口的相关概念、原理、使用方法及操作注意事项,需要的朋友可以参考下
    2019-12-12
  • spring boot中spring框架的版本升级图文教程

    spring boot中spring框架的版本升级图文教程

    Spring Boot是一款基于Spring框架的快速开发框架,它提供了一系列的开箱即用的功能和组件,这篇文章主要给大家介绍了关于spring boot中spring框架的版本升级的相关资料,需要的朋友可以参考下
    2023-10-10
  • Java泛型机制与反射原理相关知识总结

    Java泛型机制与反射原理相关知识总结

    今天带大家学习的是关于Java进阶的相关知识,文章围绕着Java泛型机制与反射原理展开,文中有非常详细的介绍及代码示例,需要的朋友可以参考下
    2021-06-06
  • springboot+vue部署按照及运行方法

    springboot+vue部署按照及运行方法

    在本篇文章里小编给大家整理了关于springboot+vue部署按照及运行方法和实例内容,需要的朋友们学习参考下。
    2020-01-01
  • springboot整合过滤器实战步骤

    springboot整合过滤器实战步骤

    在项目开发过程中,过滤器或者拦截器几乎是必用的,他可以很方便的完成类似日志处理、token验证等一系列操作,区别于业务接口,独立进行处理,感觉就是一种Aop思想。下面模拟请求接口前的token验证,进行过滤器的实战
    2022-04-04
  • 详解Java中clone的写法

    详解Java中clone的写法

    这篇文章主要介绍了Java中clone的写法,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-07-07
  • spring boot security自定义认证的代码示例

    spring boot security自定义认证的代码示例

    这篇文章主要介绍了spring boot security自定义认证,本文通过示例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-07-07
  • java的split方法使用示例

    java的split方法使用示例

    这篇文章主要介绍了java的split方法使用示例,需要的朋友可以参考下
    2014-04-04
  • 使用Spring来创建一个简单的工作流引擎

    使用Spring来创建一个简单的工作流引擎

    这篇文章主要给大家介绍了关于使用Spring来创建一个简单的工作流引擎的相关资料,需要的朋友可以参考下
    2006-12-12
  • 解决idea 通过build project 手动触发热部署失败的问题

    解决idea 通过build project 手动触发热部署失败的问题

    在debug运行项目的过程中,并且保证(不添加方法,不修改方法名)一定的规则的情况下,可以通过build project 来手动热部署项目,本文给大家介绍解决idea 通过build project 手动触发热部署失败的问题,感兴趣的朋友一起看看吧
    2023-12-12

最新评论