轻源码

  • QingYuanMa.com
  • 全球最大的互联网技术和资源下载平台
搜索
一起源码网 门户 微信小程序 查看主题

面向新手《十二》:拍照或选择图片并上传文件,关于tabbar

发布者: davidliangcn | 发布时间: 2018-1-18 05:44| 查看数: 1764| 评论数: 1|帖子模式

本系列专门新手设计,可能是一些新手难以突破的知识点;你可以在搜索内搜索“面向新手”来查看全部系列文章;
一:拍照或选择图片并上传文件

调用拍照API:

上传文件API:

主要js代码:

 choice: function () {
    var that = this
    wx.chooseImage({
      count: 1, // 默认9
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
      success: function (res) {
        // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
        var tempFilePaths = res.tempFilePaths
        that.setData({
          textHidden: true,
          image_photo: tempFilePaths,
          photoHidden: false
        })
      }
    })
  },
  uploadPhoto: function () {
    var that = this
    let param = util.json2Form({
      tel: '18600346580',
      orderSn: that.data.orderSn,
      parkingPhoto: that.data.image_photo,
    });
    wx.uploadFile({
      url: 'https://testapi.****.com/v4.0.0/uploadParkingPhoto', //仅为示例
      filePath: that.data.image_photo[0],
      name: 'parkingPhoto',
      formData: {
        'tel': '***********',
        'orderSn': that.data.orderSn,
      },
      success: function (res) {
        var obj = JSON.parse(res.data);;
        console.log(obj.result)
        console.log(obj.msg)
        var resule = obj.result;
        var msg = obj.msg;
        if (resule == 'false') {
          wx.showToast({
            title: msg,
            icon: 'success',
            duration: 2000
          })
        } else {
          wx.navigateBack({
            delta: 1,
            success: function (res) {
              wx.showToast({
                title: msg,
                icon: 'success',
                duration: 2000
              })
            },

          })
        }
      }
    })

  }

Tip:

1.调用wx.chooseImage() 自动弹出选择窗口,不用调用操作菜单wx.showActionSheet(),否则重复

如图

2. 上传文件的时候filePath必须是数组,当你单张的时候需要使用数组,若只有一张要用[0]

3. 最需要注意的是,success返回数据是String类型,我们需要将String类型转换成Object

js字符串转换成obj

用js 是有三种方法的

  • js自带的eval函数,其中需要添加小括号eval('('+str+')');
  • JSON.parse(str)
  • $.parseJSON( jsonstr )

但是在微信小程序中,我们只能用JSON.parse(str),其他的都不可以


二:关于微信小程序的tabbar

1.确认你的 app.json下的"pages"对象中 第一个page是你的 tabbar中list集合的第一个page
如:
"pages":[
"pages/shouye/shouye",
"pages/mainpage/mainpage",

"pages/fund/fund",
"pages/zichan/zichan",
"pages/mine/mine"
],
=======================================
"list": [{
"pagePath": "pages/shouye/shouye",
"text": "首页",
"iconPath": "pages/image/home_off.png",
"selectedIconPath": "pages/image/home_on.png"
},...]
2.确认你的tabbar设置了这几个不可以少的属性
"pagePath": "pages/shouye/shouye",
"text": "首页",
"iconPath": "pages/image/home_off.png",
"selectedIconPath": "pages/image/home_on.png"
(我这里image建在pages文件夹下面,路径可能和你们不一样 ps:路径必须要对)
3.确认你的list集合长度不小于2且不大于5 (官方要求的)

最新评论

Fendy 发表于 2022-5-11 23:59
代码从哪里下载

轻源码让程序更轻更快

QingYuanMa.com

工作时间 周一至周六 8:00-17:30

侵权处理

客服QQ点击咨询

关注抖音号

定期抽VIP

Copyright © 2016-2021 https://www.171739.xyz/ 滇ICP备13200218号

快速回复 返回顶部 返回列表