当前位置: 首页 » 笔记 » 微信小程序选择照片(支持拍照)、获取图片信息、预览图片、保存图片到相册

微信小程序选择照片(支持拍照)、获取图片信息、预览图片、保存图片到相册

零分笔记2,4042022-11-06 23:19

微信小程序图片操作wxml:

<button bindtap="choose">选择图片</button>
<button bindtap="getInfo">获取图片信息</button>
<button bindtap="preview">预览图片</button>
<button bindtap="save">保存图片到相册</button>

<!-- 展示上传成功的图片 -->
<image src="{{loadSrc}}"></image>

微信小程序图片操作JS:

Page({

    /**
     * 页面的初始数据
     */
    data: {
        loadSrc:''
    },
    // 保存图片
    save(){
        var that=this;
        wx.saveImageToPhotosAlbum({
            filePath:that.data.loadSrc,
            success(res){
                console.log('save success!!!');
            }
        })
    },
    // 预览图片
    preview(){
        var that=this
        wx.previewImage({
            urls:[that.data.loadSrc],
            showmenu:true
        })
    },
    // getImageInfo
    getInfo(){
        var that=this;
        wx.getImageInfo({
            src:that.data.loadSrc,
            success(res){
                console.log(res,'ressuccess');

            }
        })
    },
    // 选择图片
    choose(){
        var that=this
        wx.chooseMedia({
            success(res){
                that.setData({
                    loadSrc:res.tempFiles[0].tempFilePath
                })
            },
            fail(res){
            },
            complete(res){
            }
        })
    },

})
END
零分站龄5个月资深站长
一个喜欢折腾,却又折腾不出像样东西的,不会PHP的PHP程序员!
323
文章
8
分类
125
标签
2
友链
onlinelovesky317355746vipsever@vip.qq.com