账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    一个关于async/await异步请求的问题o_0?
    26
    0

    nuxt.js 框架的 asyncData方法里面

     let [
            FindInstitutionsDetailed,
            EnterpriseHot,
        ]
        = await Promise.all([
                    P.FindInstitutionsDetailed({'id':context.route.query.id+''}),
                    P.EnterpriseHot()
                ])
                return {
                    ***FindInstitutionsDetailed***: FindInstitutionsDetailed.data,
                    EnterpriseHot: EnterpriseHot.data,
                }

    如上图,一直是这样写,页面渲染之前会Promise.all 并发请求所有接口。这样是没问题的。

    但是,现在有一个接口需要从FindInstitutionsDetailed这个接口里获取userId作为参数。

    想问一下该怎么写呢?在nuxt里面访问不到this......
    或者在Promise.all(...)后面.then() ???

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 隔壁小姨子 普通会员 1楼

      在JavaScript中,async/await是一种在函数中处理异步操作的方式。它允许你编写异步函数,这些函数返回一个Promise对象,当异步操作完成时,Promise对象会被resolve,并且你可以通过await关键字等待Promise对象的状态改变(例如resolve或reject)。

      以下是一个简单的示例,展示如何使用async/await异步请求:

      ```javascript // 导入async/await库 const { async, await } = require('async');

      // 创建一个异步函数,用于异步获取数据 async function fetchData(url) { try { // 发送GET请求 const response = await fetch(url);

      // 检查响应状态码
      if (response.ok) {
        // 如果响应状态码是200,表示请求成功,返回数据
        return response.json();
      } else {
        // 如果响应状态码不是200,表示请求失败,返回错误信息
        throw new Error('Failed to fetch data from ' + url);
      }
      

      } catch (error) { // 处理请求失败的异常 console.error('Error fetching data:', error); } }

      // 使用async函数发起异步请求 async function main() { // 定义请求的URL const url = 'https://api.example.com/data';

      // 调用fetchData函数发起异步请求 const data = await fetchData(url);

      // 打印数据 console.log(data); }

      main(); ```

      在这个示例中,我们首先导入了async/await库,然后定义了一个异步函数fetchData,该函数接收一个URL作为参数,并使用async/await语法发起GET请求。如果请求成功,函数返回响应数据,否则抛出一个错误。

      然后,我们定义了一个main函数,该函数定义了一个请求URL,调用fetchData函数发起异步请求,并将结果打印到控制台。

      在这个例子中,我们使用了await关键字来等待fetchData函数的异步操作完成。当Promise对象resolve时,fetchData函数的异步操作被终止,控制权被传递给Promise对象的resolve方法,此时我们可以获取到Promise对象的状态,从而获取到请求的结果。

      需要注意的是,async/await的异步请求需要在异步函数的上下文中使用,而不是在异步函数内部。例如,下面的示例中的fetchData函数必须在异步函数的外部定义:

      ```javascript // 导入async/await库 const { async, await } = require('async');

      // 定义一个异步函数,用于异步获取数据 async function fetchData(url) { try { // 发送GET请求 const response = await fetch(url);

      // 检查响应状态码
      if (response.ok) {
        // 如果响应状态码是200,表示请求成功,返回数据
        return response.json();
      } else {
        // 如果响应状态码不是200,表示请求失败,返回错误信息
        throw new Error('Failed to fetch data from ' + url);
      }
      

      } catch (error) { // 处理请求失败的异常 console.error('Error fetching data:', error); } }

      // 使用async函数发起异步请求 async function main() { // 定义请求的URL const url = 'https://api.example.com/data';

      // 在异步函数的外部定义fetchData函数 async function fetchData(url) { try { // 发送GET请求 const response = await fetch(url);

        // 检查响应状态码
        if (response.ok) {
          // 如果响应状态码是200,表示请求成功,返回数据
          return response.json();
        } else {
          // 如果响应状态码不是200,表示请求失败,返回错误信息
          throw new Error('Failed to fetch data from ' + url);
        }
      } catch (error) {
        // 处理请求失败的异常
        console.error('Error fetching data:', error);
      }
      

      }

      // 调用fetchData函数发起异步请求 const data = await fetchData(url);

      // 打印数据 console.log(data); }

      main(); ```

      在这个示例中,我们在main函数的外部定义了一个fetchData函数,该函数的异步请求是通过async关键字和await关键字调用fetchData函数发起的,因此该函数不再是一个单独的异步函数,而是被包装在一个async函数中。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部