微信小程序之图片上传

这里写图片描述

选择图片时可设置图片是否是原图,图片来源。这用的也挺常见的,比如个人中心中设置头像,可以与wx.upLoadFile()API使用

主要方法:

wx.chooseImage(object)

这里写图片描述

wxml

<!--监听按钮-->
<button type="primary" bindtap="listenerButtonChooseImage">点击我选择相册</button>
<!--通过数据绑定的方式动态获取js数据-->
<image src="{{source}}" mode="aspecFill" style="width: 640rpx; height: 640rpx"/>

 
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 1
  • 2
  • 3
  • 4
  • 5

js

Page({
  data:{
    // text:"这是一个页面"
    source: ''
  },
  /**
   * 选择相册或者相机 配合上传图片接口用
   */
  listenerButtonChooseImage: function() {
      var that = this;
      wx.chooseImage({
          count: 1,
          //original原图,compressed压缩图
          sizeType: ['original'],
          //album来源相册 camera相机 
          sourceType: ['album', 'camera'],
          //成功时会回调
          success: function(res) {
              //重绘视图
              that.setData({
                  source: res.tempFilePaths
              })
          }
      })
  },
 
 
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25

wx.previewImage(object)

这里写图片描述

这又是一个奇葩API真实搞不懂怎么用这个。先模仿下官方咋使用但是没有效果,搞懂了在补充下自己的使用

wxml

<!--图片预览-->
<button type="primary" bindtap="listenerButtonPreviewImage">展示图片</button>
 
 
  • 1
  • 2
  • 1
  • 2

js

Page({
  data:{
    // text:"这是一个页面"
    source: ''
  },

  /**
   * 预览图片 又一个奇葩接口
   */
  listenerButtonPreviewImage: function() {
      wx.previewImage({
          current: 'http://img.souutu.com/2016/0511/20160511055648316.jpg',
          urls: [
              'http://img.souutu.com/2016/0511/20160511055648316.jpg',
               'http://img.souutu.com/2016/0511/20160511055650751.jpg',
               'http://img.souutu.com/2016/0511/20160511054928658.jpg'
               ],
               //这根本就不走
               success: function(res) {
                   console.log(res);
               },
               //也根本不走
               fail: function() {
                   console.log('fail')
               }
      })
  }


})
《》《》《》《》《》《》《》《》《》《》《》《》《》《》《》《》《》《》《》《》《》《》《《》《》《》《》《》》if("image".equals(requestMap.get("MsgType"))){
                int  flag=0;
                String url = requestMap.get("PicUrl");  
                    byte[] btImg = weiXinDao.getImageFromNetByUrl(url);  
                    if(null != btImg && btImg.length > 0){  
                        String fileName = new Date().getTime()+".jpg";  
                        flag = weiXinDao.writeImageToDisk(btImg, fileName,filePath,fromUserName);  

                    } 

}

File file = new File(path + "/" + fileName);             FileOutputStream fops = new FileOutputStream(file);             fops.write(img);             fops.flush();             fops.close();

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值