微信小程序wepy 网络请求，数据返回了，但是在程序中的变量却未赋值，提示未定义？

Question

微信小程序wepy 网络请求，数据返回了，但是在程序中的变量却未赋值，提示未定义？

环境：按照社区的付费教程一步一步的写的，去年完成过一次了，没出现这个问题
app.wpy文件，

<style lang="less">
.container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
}
</style>

<script>
import wepy from 'wepy'
import 'wepy-async-function'

import { setStore } from 'wepy-redux'
import configStore from './store'

const store = configStore()
setStore(store)

export default class extends wepy.app {
  config = {
    pages: [
      'pages/index'
    ],
    window: {
      backgroundTextStyle: 'light',
      navigationBarBackgroundColor: '#fff',
      navigationBarTitleText: 'WeChat',
      navigationBarTextStyle: 'black'
    }
  }

  globalData = {
    userInfo: null
  }

  constructor () {
    super()
    this.use('requestfix')
  }

  onLaunch() {
    this.testAsync()
  }

  sleep (s) {
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        resolve('promise resolved')
      }, s * 1000)
    })
  }

  async testAsync () {
    const data = await this.sleep(3)
    console.log(data)
  }

  getUserInfo(cb) {
    const that = this
    if (this.globalData.userInfo) {
      return this.globalData.userInfo
    }
    wepy.getUserInfo({
      success (res) {
        that.globalData.userInfo = res.userInfo
        cb && cb(res.userInfo)
      }
    })
  }
}
</script>

api.js

import wepy from 'wepy'

// 服务器接口地址
const host = 'http://localhost:7012'
// const host = 'http://v.juhe.cn/laohuangli/d?'
// const host = 'https://learnku.com';

// 普通请求
const request = async (options, showLoading = true) => {
  // 简化开发，如果传入字符串则转换成 对象
  if (typeof options === 'string') {
    options = {
      url: options
    }
  }
  // 显示加载中
  if (showLoading) {
    wepy.showLoading({title: '加载中'})
  }
  // 拼接请求地址
  options.url = host + '/' + options.url
  // 调用小程序的 request 方法
  let response = await wepy.request(options)

  if (showLoading) {
    // 隐藏加载中
    wepy.hideLoading()
  }
 
  // 服务器异常后给与提示
   console.log('↓↓↓↓ request 返回值↓↓↓↓');
  // console.log(response);
  /*if (response.statusCode === 500) {
    wepy.showModal({
      title: '提示',
      content: '服务器错误，请联系管理员或重试'
    })
  }*/
  return response
 
}

// 登录
const login = async (params = {}) => {
  // code 只能使用一次，所以每次单独调用
  // let loginData = await wepy.login()
  // console.log(wepy);
  // 参数中增加code
  // params.code = loginData.code

  // 接口请求 weapp/authorizations

  let authResponse = await request({
    url: 'user/login/login',
    data: params,
    method: 'POST',
    success:function(data){
    // console.log(data);
    return data
    } 
  })
 
  // 登录成功，记录 token 信息

   
}

// 登录
const date = async (params = {}) => {
  // code 只能使用一次，所以每次单独调用
  

  // 参数中增加code
  // params.code = loginData.code

  // 接口请求 weapp/authorizations
let authResponse ;
    authResponse = await request({
    url: 'topics',
    data: params,
    method: 'GET',
    success:function(data){
    console.log(data);
    }
  })
 
  // 登录成功，记录 token 信息
   console.log(authResponse);
   return authResponse
}

export default {
  request,
  login,
  date
}

模板文件 包含发起请求

<style lang="less">
.login-wrap {
  margin-top: 50px;
}
</style>
<template>
  <view class="page">
    <view class="page__bd login-wrap">
      <view class="weui-toptips weui-toptips_warn" wx:if="{{ errorMessage }}">{{ errorMessage }}</view>

      <view class="weui-cells__title">用户登录</view>
      <view class="weui-cells weui-cells_after-title">
        <view class="weui-cell weui-cell_input {{ error ? 'weui-cell_warn' : ''}}">
          <view class="weui-cell__hd">
            <view class="weui-label">用户名</view>
          </view>
          <view class="weui-cell__bd">
            <input value="adsfa@qq.com" class="weui-input" placeholder="手机号或邮箱" @input="bindUsernameInput" />
          </view>
          <view wx:if="{{ error }}" class="weui-cell__ft">
            <icon type="warn" size="23" color="#E64340"></icon>
          </view>
        </view>
        <view class="weui-cell weui-cell_input {{ error ? 'weui-cell_warn' : ''}}">
          <view class="weui-cell__hd">
            <view class="weui-label">密码</view>
          </view>
          <view class="weui-cell__bd">
            <input value="222222" class="weui-input" placeholder="输入密码" type="password" @input="bindPasswordInput" />
          </view>
          <view wx:if="{{ error }}" class="weui-cell__ft">
            <icon type="warn" size="23" color="#E64340"></icon>
          </view>
        </view>
      </view>

      <view class="weui-btn-area">
        <button class="weui-btn" type="primary" @tap="submit1">登录</button>
      </view>
    </view>
  </view>
</template>

<script>
  import wepy from 'wepy'
  import api from '@/utils/api'

  export default class Login extends wepy.page {
    config = {
      navigationBarTitleText: '登录'
    }
    data = {
      // 用户名
      username: '',
      // 密码
      password: '',
      // 是否有错
      error: false,
      // 错误信息
      errorMessage: ''
    }
    methods = {
      // 绑定用户名 input 变化
      bindUsernameInput (e) {
        this.username = e.detail.value
      },
      // 绑定密码 input 变化
      bindPasswordInput (e) {
        this.password = e.detail.value
      },
      // 表单提交
      async submit() {
        // 提交时重置错误
        this.error = false
        this.errorMessage = ''

        /*if (!this.username || !this.password) {
          this.errorMessage = '请填写账户名和密码'
          return
        }*/

        // 获取用户名和密码
        let params = {
          username: this.username,
          password: this.password
        }

        try {
          let authResponse = await api.login(params)
          console.log(authResponse);
          // 请求结果为 401 说明用户名和密码错误，显示错误提示
           
        } catch (err) {
          console.log(err);
          wepy.showModal({
            title: '提示',
            content: '服务器错误，请联系管理员'
          })
        }
      },
    async submit2() {
        // 提交时重置错误
        this.error = false
        this.errorMessage = ''
        let params = {
          _pjax:'body'
       }
        try {
          let authResponse = await api.date(params)
          // console.log(authResponse);
          // 请求结果为 401 说明用户名和密码错误，显示错误提示
           
        } catch (err) {
          console.log(err);
          wepy.showModal({
            title: '提示',
            content: '服务器错误，请联系管理员'
          })
        }

      },
        async submit1() {
        // 提交时重置错误
        this.error = false
        this.errorMessage = ''
        let params = {
          date: '2019-04-14',
          key:'c864d5cd5d1b75d7da6c9839691090c1'
       }
        try {
          let authResponse = await api.date(params)
          console.log(authResponse);
          // 请求结果为 401 说明用户名和密码错误，显示错误提示
           
        } catch (err) {
          console.log(err);
          wepy.showModal({
            title: '提示',
            content: '服务器错误，请联系管理员'
          })
        }
      }

    }
    // 页面打开事件
    async onShow() {
      
      /*try {
        // 打开页面自动调用一次登录
        let authResponse = await api.login()

        // 登录成功返回上一页
        if (authResponse.statusCode === 201) {
          wepy.navigateBack()
        }
      } catch (err) {
        wepy.showModal({
          title: '提示',
          content: '服务器错误，请联系管理员'
        })
      }*/
    }
  }
</script>

当点击登录按钮时，请求submit或者submit1 ，请求login或date 接口，现象是在开发工具控制台中均有数据返回，但是程序中接收时，却提示未定义，截图如下：

Answer 1

我被你的api.js的封装操作惊呆了……你能拿到数据才有鬼呢……

async函数是不能return的。因为async函数是默认return一个promise对象的。
请看看async/await的原理
http://es6.ruanyifeng.com/#do...

建议你的api封装改一下

// 登录
const date = function(params = {}){
    return new Promise((resolve, reject) => {
        wx.request({
          url: 'topics',
          data: params,
          method: 'GET',
          success: function(res) {
            if (res.data.code === 200) {
              resolve(res.data.data)
            } else {
              reject(res.data.message)
            }
          },
          fail: function(err) {
            reject(err)
          }
        })
    }
}

看这里
https://blog.csdn.net/qq_3060...

Answer 2

既然是login用了await/async语法糖不应该这样

let authResponse = await api.login(params).then(res => {})

Answer 3

promise resolved 这个应该是切入点