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)

}

})

})

相关推荐
沉默璇年1 小时前
react中useMemo的使用场景
前端·react.js·前端框架
yqcoder1 小时前
reactflow 中 useNodesState 模块作用
开发语言·前端·javascript
2401_882727571 小时前
BY组态-低代码web可视化组件
前端·后端·物联网·低代码·数学建模·前端框架
SoaringHeart2 小时前
Flutter进阶:基于 MLKit 的 OCR 文字识别
前端·flutter
会发光的猪。2 小时前
css使用弹性盒,让每个子元素平均等分父元素的4/1大小
前端·javascript·vue.js
天下代码客2 小时前
【vue】vue中.sync修饰符如何使用--详细代码对比
前端·javascript·vue.js
猫爪笔记2 小时前
前端:HTML (学习笔记)【1】
前端·笔记·学习·html
前端李易安3 小时前
Webpack 热更新(HMR)详解:原理与实现
前端·webpack·node.js
红绿鲤鱼3 小时前
React-自定义Hook与逻辑共享
前端·react.js·前端框架
Domain-zhuo3 小时前
什么是JavaScript原型链?
开发语言·前端·javascript·jvm·ecmascript·原型模式