阅读 23

微信小程序-上传图片

注意:图片目前只是上传到了内存

使用

 wx.chooseImage({
      count: 6,
      sizeType: [‘original‘, ‘compressed‘],
      sourceType: [‘album‘, ‘camera‘],
……

 

 

 

 

 

 

 

样式:

 

 

wxml:

<view bindtap="uploadImage" >请上传图片view>
<view class="container">
<view  wx:for="{{imageList}}" wx:key="index">
  <image  src="{{item}}" >image>
view>
view>

wxss:

.container image{
  width: 200rpx;
  height: 200rpx;
  padding: 5rpx;
  display: flex;
  flex-direction: row;
}

.container {
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   flex-wrap:wrap; /*实现图片换行展示*/
}

js:

uploadImage: function(e) {
    //注意:图片目前只是上传到了内存。
    var that = this;
    wx.chooseImage({
      count: 6,
      sizeType: [‘original‘, ‘compressed‘],
      sourceType: [‘album‘, ‘camera‘],
      success: function(res) {
        // 设置imageList,页面上图片自动修改。
        console.log(res)
        // that.setData({
        //   //覆盖原有图片
        //   imageList: res.tempFilePaths
        // });

        // 默认图片 + 选择的图片; 
        that.setData({
          //列表拼接
          //l1=[1,2] l2=[3,4] l1.concat(l2)=[1,2,3,4] 类似于python中extend
          imageList: that.data.imageList.concat(res.tempFilePaths)
        });
      },
      fail:function(res){

      },
      complete: function (res) {
          console.log(‘无论如何都执行‘)
      }
    });
  },

 

原文:https://www.cnblogs.com/xiao-apple36/p/12804493.html

文章分类
代码人生
文章标签
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐