微信小程序（三十三）promise异步写法

代码对我眨眼睛2024-02-07 21:14

注释很详细，直接上代码

新增内容：

1.promise异步与普通异步的写法区别

2.promise异步的优势

源码：

index.wxml

xml 复制代码

<view class="preview" bind:tap="onChoose">
    <image src="{{avatar}}" mode="aspectFill"/>
</view>

index.wxss

css 复制代码

.item{
    display: flex;
    /* 水平均分 */
    justify-content:space-evenly;
    height: 60rpx;
}           

/* 页面对比色 */
page{
  background-color: #f2f2f2;  
}

index.js

js 复制代码

Page({
    data:{
        //存储学生信息的数组
        students:[],
        avatar:"/images/start.png"
    },
    //promise异步调用方法
    //不用写success的方法，避免不必要的嵌套
    //这里只是个范例，可以应用于任意支持promise异步的方法
    async onChoose(){
        //使用其中关键词进行解构
        const {tempFiles}= await wx.chooseMedia({
            mediaType:['image'],//数组里面是数据类型，可以有多个，默认是图片视频都可以
            count:1,//设置可选择的媒体数量，默认9张，根据版本不同最多为9或20张
        })
        
        //路径赋值
        this.setData({
           avatar:tempFiles[0].tempFilePath
        })
    }
})

效果演示：