微信小程序 -- 项目中会用到的,如预览图片、文件上传到后台实时进度、微信扫一扫、复制文字

1. 预览图片

var url = [ 
      'https://img1.gtimg.com/10/1048/104857/10485731_980x1200_0.jpg',
      'https://img1.gtimg.com/10/1048/104857/10485726_980x1200_0.jpg'
]
 wx.previewImage({
     current: '',
      // 所有图片的URL列表,数组格式
      urls: url,
      success: function (res) {

      }
})

长按图片有“发送给朋友”、“保存图片”、“收藏”等等选项。

效果如下:

微信小程序 -- 项目中会用到的,如预览图片、文件上传到后台实时进度、微信扫一扫、复制文字_第1张图片         微信小程序 -- 项目中会用到的,如预览图片、文件上传到后台实时进度、微信扫一扫、复制文字_第2张图片

2. 文件上传到后台的进度。

微信小程序调用APi -- wx.uploadFile 实现文件上传到后台服务器,其返回值的对象uploadTask可以监听上传进度变化的事件和取消上传。其中uploadTask.onProgressUpdate即为监听上传进度变化事件。

//wx.uploadFile:实现文件的上传
var uploadTask = wx.uploadFile({
  url: '', //接口地址
  filePath: tempFilePaths[0], //上传的文件
  name: 'file', 
  formData:{}, //其他请求参数
  success (res){
    var data = res.data
    //do something
  }
})
//监听上传进度变化
uploadTask.onProgressUpdate((res) => {
  console.log('上传进度', res.progress)
  console.log('已经上传的数据长度', res.totalBytesSent)
  console.log('预期需要上传的数据总长度', res.totalBytesExpectedToSend)
})

4. 微信扫一扫

wx.scanCode({
  success: (res) => {
    console.log(res)
  }
})

5.复制文字

wx.setClipboardData({
    data: "复制的文字",
    success: function (res) {
        wx.showToast({
           title: '复制成功'
        })
    }
})

 

你可能感兴趣的:(微信小程序)