uniapp将异步api变成同步

<template>

<view class="content">

<image class="logo" src="/static/logo.png"></image>

<view class="text-area">

<text class="title">{{title}}</text>

</view>

</view>

</template>

<script>

import {

request

} from '@/tools/request/index.js'

export default {

data() {

return {

title: 'Hello',

}

},

onShow() {

this.fun1()

},

methods: {

async fun1() {

//等待执行

const rs = await this.fun2()

console.log(rs);

console.log('执行完成')

},

//耗时操作

fun2() {

return new Promise((resolve,reject) => {

uni.request({

url:'http://www.baidu.com',

success: (res) => {

resolve('ok')

},

fail: (err) => {

reject('err')

}

})

})

}

}

}

</script>

<style>

.content {

display: flex;

flex-direction: column;

align-items: center;

justify-content: center;

}

.logo {

height: 200rpx;

width: 200rpx;

margin-top: 200rpx;

margin-left: auto;

margin-right: auto;

margin-bottom: 50rpx;

}

.text-area {

display: flex;

justify-content: center;

}

.title {

font-size: 36rpx;

color: #8f8f94;

}

.red {

color: red;

}

.blue {

color: blue;

}

</style>

如果是showModal

示例

return new Promise( async resolve=> {

uni.showModal({

title:'title',

content:'content',

success: (res) => {

resolve(res)

}

})

})

相关推荐
灰小猿10 小时前
Spring前后端分离项目时间格式转换问题全局配置解决
java·前端·后端·spring·spring cloud
im_AMBER10 小时前
React 16
前端·笔记·学习·react.js·前端框架
02苏_10 小时前
ES6模板字符串
前端·ecmascript·es6
excel10 小时前
⚙️ 一次性警告机制的实现:warnOnce 源码深度解析
前端
excel10 小时前
Vue SFC 样式编译核心机制详解:compileStyle 与 PostCSS 管线设计
前端
excel10 小时前
🧩 使用 Babel + MagicString 实现动态重写 export default 的通用方案
前端
excel10 小时前
Vue SFC 编译器主导出文件解析:模块组织与设计哲学
前端
excel10 小时前
深度解析:Vue SFC 模板编译器核心实现 (compileTemplate)
前端
excel10 小时前
Vue SFC 解析器源码深度解析:从结构设计到源码映射
前端
excel10 小时前
Vue SFC 编译全景总结:从源文件到运行时组件的完整链路
前端