微信小程式 Image API實例詳解

這篇文章主要介紹了微信小程式 Image API實例詳解的相關資料,需要的朋友可以參考下

選擇圖片時可設定圖片是否是原圖，圖片來源。這用的也蠻常見的，例如個人中心中設定頭像，可以與wx.upLoadFile()API使用

主要方法：

wx.chooseImage(object)

🎟

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

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
       })
     }
   })
 },

🎜🎜🎜wx.previewImage(object)🎜🎜🎜🎜🎜這樣先模仿下官方咋使用但是沒有效果，搞懂了在補充下自己的使用🎜🎜🎜wxml🎜🎜🎜🎜

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

🎜🎜🎜🎜js🎜🎜 ，謝謝大家對本站的支持！ 🎜🎜更多微信小程式 Image API實例詳解相關文章請關注PHP中文網！ 🎜