如何在微信小程序中实现图片选择功能？

  今天小编分享的是如何在微信小程序中实现图片选择功能?对这个感兴趣的小伙伴就和小编一起学习一下吧，下面就是具体操作流程。

  从本地相册选择图片或使用相机拍照

  wx.chooseImage(OBJECT)

  参数说明

  效果图，设置为一开始为Carly Rae Jeepson

  使用过程如下：

  wx.chooseImage({

  count: 1, // 默认9

  sizeType: [\'original\', \'compressed\'], // 可以指定是原图还是压缩图，默认二者都有sourceType: [\'album\', \'camera\'], // 可以指定来源是相册还是相机，默认二者都有success: function (res) {// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片var tempFilePaths = res.tempFilePaths}

  })

  代码镶嵌在原本的代码框架中就是现在这样：

  《---picture.js》

  //index.js

  //获取应用实例

  var app = getApp()

  Page({

  data: {

  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,

  })

  wx.previewImage({

  current: \'//119.29.74.46/myphoto/0.jpg\', // 当前显示图片的链接，不填则默认为 urls 的第一张urls: [ \'//119.29.74.46/myphoto/0.jpg\',\'//119.29.74.46/myphoto/1.jpg\',\'//119.29.74.46/myphoto/2.jpg\',\'//119.29.74.46/myphoto/3.jpg\',\'//119.29.74.46/myphoto/4.jpg\'

  , \'//119.29.74.46/myphoto/5.jpg\',

  \'//119.29.74.46/myphoto/6.jpg\',

  \'//119.29.74.46/myphoto/7.jpg\'],

  success: function(res){

  },

  fail: function() {

  // fail

  },

  complete: function() {

  // complete

  }

  }) }

  })

  },

  onShareAppMessage: function () {

  return {

  title: \'欢迎使用颜大傻牌跑步计\',

  desc: \'将你的战绩分享到~~~\',

  path: \'/page/picture/picture.js\'

  }

  },

  })

  《---picture.wxml》

  

  

  

  

   点击我选择相册

   发布

  

  整体的文件架构图如下：

  以上就是如何在微信小程序中实现图片选择功能的全部内容了，大家都学会了吗?