美文网首页
Promise引入

Promise引入

作者: 如雨随行2020 | 来源:发表于2021-12-22 00:55 被阅读0次

一、在回调函数中处理后面业务
二、setData最好放在最后执行(应该没影响,以防万一)
因为setData是异步的,可能setData还没执行完,后面的代码就先执行了,所以,后面使用setData后的data里面的数据可能会不正确。所以尽量不要用setData里的数据,直接用 用来setData的数据。并且将setData放在最后执行
******************************************************************************************
关于第二条,setData渲染页面是异步,但是setData改变data里面的数据是同步的。
但是为了提高性能,不可能改变一次数据渲染一次页面,等所有data改变完之后一块渲染页面.
三、使用Promise
项目需要获取用户的openid,逻辑是在app.js的getOpenid中调用wx.login方法,
success之后wx.request去请求后台获取openid;
获取成功之后在page的onLoad方法中使用;
可以使用回调函数解决,但是回调层次多了,回调的写法就会很复杂
使用Promise可以简化写法;那么Promise如何使用呢,代码如下
app.js

App({
  globalData: {
    hostUrl: "https://wxapp.becypress.com/"
  },
  onLaunch: function () {
    // 展示本地存储能力
    var logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)
  },
  getOpenid:function(){
    var that = this;
    return new Promise(function (resolve, reject){
      wx.login({
        success: function (res) {
          if (res.code) {
            //发起网络请求
            wx.request({
              url: that.globalData.hostUrl + 'wechat/app/login/' + res.code,
              data: {
              },
              success: function (res) {
                //resolve到index.js的then中  
                resolve(res.data.openid);
              }
            });
          } else {
            console.log('登录失败!' + res.errMsg)
          }
        }
      });
    }); 
  }
})

index.js

var app = getApp();
Page({
  data: {
    url:""
  },
  onLoad: function (options) {
    var that = this;
    app.getOpenid().then(function(openid){
      that.setData({
        url: app.globalData.hostUrl + "app/index.html?opneid=" + openid
      });
    });
  }
})

相关文章

  • Promise引入

    一、在回调函数中处理后面业务二、setData最好放在最后执行(应该没影响,以防万一)因为setData是异步的,...

  • async和await的使用小结

    async和await是promise的语法糖。promise是ES6引入的,async/await是ES7引入的...

  • 08JavaScript-ES6(3)

    Promise Promise 是 ES6 引入的异步编程的新解决方案。语法上 Promise 是一个构造函数,用...

  • js es6 Promise

    1.为什么要使用Promise 为了解决回调地狱问题,ES6引入了Promise的概念 2.Promise的基本概...

  • Promise 实现

    创建一个 Promise.js 文件 其他文件中引入

  • Javascript学习笔记-Promise

    1. Promise简介 Promise是ES6新引入的对象,是新增加的异步处理手段。在Javascript 中在...

  • nodejs 函数promise化

    一. 概念 指将带有callback函数重新变成promise来实现 二. 使用 需要引入一个promise库如b...

  • 解决部分浏览器 不识别promise的问题

    一、安装es6-promise 二、main.js文件中引入

  • ES6的异步起始

    Promise Promise是ES6引入的一种异步编程的解决方案; Promise是一个容器,保存着一个事件的结...

  • iOS Promise学习小结

    一、Promise概述 1、为什么引入Promise 在日常开发中,异步操作是很常见的情况,比如发起网络请求后,处...

网友评论

      本文标题:Promise引入

      本文链接:https://www.haomeiwen.com/subject/lvyraltx.html