vue .then和链式调用

这篇具有很好参考价值的文章主要介绍了vue .then和链式调用。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

如果下级函数存在异步操作,

并且上级函数需要等待下级函数的异步操作完成后再继续执行,

那么在上级函数中就需要使用 .then() 方法来处理异步操作的结果。

2

在let obj =  axios.get(path).then((resp => { return resp })

这个链式调用中,确实会有两个返回值。

第一个值是 请求的结果axios.get(path)

第二个值是.then()中数据处理后的结果 Promise 对象 obj 。

.then返回值是Promise 对象

4

  1. 发起异步请求:axios.get(path) 得到第一返回值
  2. 处理响应结果:.then((resp) => { ... }) 得到第二返回值Promise 对象
  3. 上级函数调用下级带.then的函数必须 .then((data) => { ... })

5 上级函数 使用了.then(), 下级函数可以不使用.then,直接返回请求结果

第一种 上级函数 .then() ,下级函数.then() 返回处理完的数据

export async function funcB() { // 这个函数的上级函数调用他 要加 async
  
  let newData = []
  
    newData = fetchData().then((data) => {
    
      console.log(data); // 直接使用数据
      return data;
    });
    console.log(newData);

  }

  return newData;
}

function fetchData() {
  try {
    let path = 'dt.csv'
    let obj = axios.get(path).then((resp) => {
        // 这里处理数据
         return data;
        })

    return obj; // 返回Promise 对象
  } catch (error) {
    // 处理错误
    console.error(error);
    return null;
  }
}

第二种 上级函数 .then() ,下级函数只返回请求结果

export async function funcB() { // 这个函数的上级函数调用他 要加 async
  
  let newData = []
  
    newData = fetchData().then((data) => {
    // 这里处理数据
      console.log(data); // 在这里处理 newData
      return data;
    });
    console.log(newData);

  }

  return newData;
}

function fetchData() {
  try {
    let path = 'dt.csv'
    let obj = axios.get(path)

    return obj; // 返回Promise 对象
  } catch (error) {
    // 处理错误
    console.error(error);
    return null;
  }
}

最顶级父函数调用 子函数

第一种 .then

let mark = funcB().then((data) => { 
        // 父函数调用子函数, 子函数有.then() 父函数必须要.then()
        // 在使用.then()方法时,如果只是想要获取异步操作的结果,而不需要对结果进行进一步处理,可以省略return关键字
      });
      console.log(mark)

第二种 async await文章来源地址https://www.toymoban.com/news/detail-553508.html

async function p顶级父函数() {
  let xxx = await funcB();
  console.log(xxx);
}

到了这里,关于vue .then和链式调用的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包