简单async/wait使用样例

最新推荐文章于 2025-06-04 10:05:22 发布

weixin_34320724

最新推荐文章于 2025-06-04 10:05:22 发布

阅读量1.5k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript c# c/c++ ViewUI

原文链接：https://my.oschina.net/qingqingdego/blog/3018892

本文探讨了Vue中异步方法的测试方法，包括使用async/await语法糖进行异步操作，以及从JS模块导入函数并在Vue组件中调用。通过具体示例展示了如何在Vue组件中实现和测试异步功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

2019独角兽企业重金招聘Python工程师标准>>>

js文件 a.js

"use strict";

export async function Test(a, b) {
  return add(a, b);
}

function add(a,b){
  return (a+b)
}

vue 文件

<template>
  <div class="mydiv">
    <div>本地测试+服务器测试发现：</div>
    <div>1、：如果直接在webservice目录下,新建文件夹保存文件。如果知道路径+文件名，则可以直接访问</div>
    <div>2、：如果是采用虚拟目录的方式,指向webservice目录外。如果知道路径+文件名，也可以直接访问</div>
    <div>
      <button @click="at_one">异步测试1</button>
    </div>
  </div>
</template>

<script>
import {Test} from '@/utils/a.js';
export default {  
  data() {
    return {
      selected: "1",
      // path:this.$router.currentRoute.path,
    };
  },
  methods: {
    at_one:async function(){
      let  res;
      // 直接异步执行了 
      Test(2,3).then(r=>{
        console.log(r); //可以输出结果5
        res=r;
        console.log(res);
      })       
      console.log('结果')
      /**
       * 结果
       * 5
       * 5
       */
      // 直接同步执行了 
      var res2=0;
      res2=await Test(2,3);
      console.log(res2);
      console.log('结果')

    }
    
  }
};

</script>
<style scoped>
</style>

执行结果


test1.vue?6d16:30 结果
test1.vue?6d16:26 5
test1.vue?6d16:28 5
test1.vue?6d16:39 5
test1.vue?6d16:40 结果

转载于:https://my.oschina.net/qingqingdego/blog/3018892