封装复用图片上传

最新推荐文章于 2024-07-31 11:41:46 发布

一只小小白✘

最新推荐文章于 2024-07-31 11:41:46 发布

阅读量95

点赞数 1

文章标签：前端 vue.js typescript

本文链接：https://blog.csdn.net/weixin_65511579/article/details/128086969

版权

// 分几步
// 封装
// 1 选择图片  返回  临时路径
function upLoadimg(url: string, su_title: string, err_title: string) {
    return new Promise((reactive, reject) => {
        uni.chooseMedia({
            // 1.选择图片（这里只能单选）
            count: 1,
            // 最多可以选择的图片张数，默认9
            mediaType: ["image"],
            //album 从相册选图，camera 使用相机，默认二者都有。如需直接开相机或直接选相册，请只使用一个选项
            sizeType: ["compressed"],
            // original 原图，compressed 压缩图，默认二者都有
            success(res) {
                // console.log(res);
                uni.showLoading({
                    title: su_title,
                    mask: true
                })
                // 2上传图片
                uni.uploadFile({
                    url, //自己的接口地址
                    filePath: res.tempFiles[0].tempFilePath,
                    name: "file",
                    success(res: any) {
                        // console.log();
                        reactive(res);
                        uni.hideLoading()
                    },
                    fail(err: any) {
                        uni.showToast({
                            title: err_title,
                            icon: "error",
                            duration: 1000,
                        });
                        reject(err)
                    }
                });
            },
        });
    });
}
export { upLoadimg }

在src根目录中的public 创建一个misc.ts文件