小程序第七天学习总结

1、上传图片功能的实现

// 上传身份证图片
  async uploadPicture(ev) {
    const type = ev.mark?.type
    const res = await wx.chooseMedia({
      count: 1,
      mediaType: ['image'],
      sourceType: ['album', 'camera'],
      sizeType: ['compressed']
    })

    wx.uploadFile({
      filePath: res.tempFiles[0].tempFilePath, // 文件路径 - 临时图片地址
      name: 'file', // 文件对应的key - 接口文档要求传 'file'
      url: wx.http.baseURL + '/upload', // 请求地址
      header: {
        Authorization: getApp().token,
      },
      success: (result) => {
        // JSON.parse() 将json字符串转成js对象
        // JSON.stringify() 将js对象转成json字符串
        const data = JSON.parse(result.data)
        if (data.code !== 10000) return wx.utils.toast('上传图片失败')
        // 图片的临时地址
        this.setData({
          [type]: data.data.url,
        })
      },
    })
  }

JSON字符串转为js对象使用JSON.parse(),反之将js对象转为JSON字符串使用JSON.stringify()

2、数字表达

<van max-count="{{12}}"></van>

3、 取数据且重命名 const {name: houseName} = res.data

4、在本地数据较多但是接口所需数据较少的情况下,我们可以先解构本地的数据,然后将解构后的数据post到后端获取对应的数据

const { houseId, repairItem } = this.data
wx.http.post('/repair', { houseId, repairItem })

5、解构里面继续解构

const{ code, data: { rows: repairList } } = await wx.http.get('/repair')

6、vant文档里面API触发事件的书写形式

bind:事件名:bind:after-read

7、微信小程序实现触底刷新

bindscrolltolower: 设置current = 1 ,当此事件触发的时候将current+=1 ,再将新的current从后端获取新的数据,

8、时间获取当前时间戳

new Date().getTime() Date.now() + 3 * 24 * 60 * 60 * 1000

9、小程序组件里面的事件需要写在methods属性里面。

  methods: {
    onClickShow(){
      console.log(12);
      this.setData({show: true})
    }
  }

10、bindtap和catchtap的区别

bind绑定的事件不会阻止冒泡
catch绑定的事件可以阻止冒泡