赞
踩
图片上传功能在微信小程序开发中经常用到,本文将详细介绍如何实现微信小程序的图片上传功能,包括图片选择、预览、上传、进度条等。
一、前置准备
在开始之前,需要准备以下内容:
微信开发者工具
拥有一个微信小程序账号
微信小程序代码编辑器
在微信公众平台注册并开通小程序功能
二、选择图片
图片上传功能的第一步是让用户从本地选择一张或多张图片,通过调用微信小程序的API wx.chooseImage(),可以实现图片选择的功能。该API接收一个对象作为参数,并返回一个 Promise,根据用户的选择结果来确定 Promise 的状态,成功则返回选定照片的本地文件路径列表,失败则返回错误信息。
代码示例:
- wx.chooseImage({
- count: 1, // 可选择的图片数量
- sourceType: ['album', 'camera'], // 可选择的图片来源
- sizeType: ['original', 'compressed'], // 可选择的图片尺寸
- success(res) {
- const tempFilePaths = res.tempFilePaths // 返回选择的图片本地文件路径列表
- console.log(tempFilePaths)
- },
- fail(res) {
- console.log(res)
- }
- })
选择图片的参数说明:
count:可选择的图片数量,默认值为 9。
sourceType:可选择的
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。