微信小程序小技巧

1.图片

图片懒加载 lazy-load='true'

图片大小不限制原比例  mode='widthFix'

图片大小保持纵横比缩放图片,完整显示但不好看不铺满  mode='aspectFit'

图片大小不一常用mode='aspectFill'


2.点击图片

  previewImage: function (e) {
    var urls = [];
    var imgsd = this.data.imgsedetaiol;
    var id = e.currentTarget.dataset.id;
    for (let i in imgsd) {
      urls.push(imgsd[i].file_thumb_url);
      if (id == imgsd[i].id) {
        var cu = imgsd[i].file_thumb_url
      }
    }
    wx.previewImage({
      current: cu, // 当前显示图片的http链接
      urls: urls // 需要预览的图片http链接列表
    });
  },


3.上传照片

chooseImage: function () {
var self =this
wx.chooseImage({
// count: 1,
sizeType: ['compressed'],
sourceType: ['album','camera'],
success: function(res) {
console.log('chooseImage success, temp path is', res.tempFilePaths[0])
var imageSrc = res.tempFilePaths;
for (let iin imageSrc){
wx.uploadFile({
url: '/api/upload/uploadImage',
filePath: imageSrc[i],
name: 'data',
success: function(res) {
console.log('uploadImage success, res is:', res)
var resf = JSON.parse(res.data);
if (resf.code== "1"){

self.setData({
imgsedetaiol: self.data.imgsedetaiol.concat(resf.list|| []),
})

} else{

}

},
fail: function({ errMsg }){
console.log('uploadImage fail, errMsg is', errMsg)
}
})
}

},
fail: function({ errMsg }){
console.log('chooseImage fail, err is', errMsg)
}
})
},






4.多选获取
var inmany =[
{ name:'1', value:'种植', checked:false },
{ name:'2', value:'养殖', checked:false },
{ name:'3', value:'本地务工', checked:false },
{ name:'4', value:'外地务工', checked:false },
];
var inArray =["种植",
"养殖",
"本地务工",
"外地务工",
];
var main_income = list.main_income.split(",")
for (var iin main_income){
inmany[inArray.indexOf(main_income[i])].checked= true;
}
that.setData({
inmany: inmany
})



5.多个input值setData

zuyxqevent: function(e) {
var that =this;

var name = e.currentTarget.dataset.name;
var id = e.detail.value;
switch (name){
case 'houseadress':
that.setData({
'basic.household_address': id
})
break;
case 'housecode':
that.setData({
'basic.household_no': id
})
break;
case 'housetype':
that.setData({
'basic.household_type': id
})
break;
case 'reason':
that.setData({
'basic.poor_reason': id.join(",")
})
break;
case 'intype':
that.setData({
'basic.main_income': id.join(",")
})
break;
case 'outtype':
that.setData({
'basic.main_pay': id.join(",")
})
break;
case 'help':
that.setData({
'basic.gov_help': id
})
break;
case 'jiaju':
that.setData({
'basic.household_furniture': id.join(",")
})
break;

}
},

6分享到
   <button class="iconfont {{active=='0'?item.src:item.src1}}" open-type="{{active=='1'?'share':''}}" ></button>

  onShareAppMessage: function (res) {
    if (res.from === 'button') {
      // 来自页面内转发按钮
      console.log(res.target)
    }
    return {
      title: '您的授权密码:' + this.data.account + '。授权有效期限:' + this.data.youxiao,
   
     // path: '/pages/VisitorPassword/index',
      success: function (res) {
        // 转发成功
      },
      fail: function (res) {
        // 转发失败
      }
    }
  },


7.小提示封装
<import src="../showToast/index.wxml" />  
<template is="showToast" data="{{showToast: showToast}}" />  
<!--上面两句话是放置模板的路径和传入的data!   data传入方式写死固定-->  
<!--<view bindtap="testToast" data-test="1">只传title,单纯文字提醒</view>  
  
<view bindtap="testToast" data-test="2">指定图标,图标+文字提醒</view>  
  
<view bindtap="testToast" data-test="3">指定duration,控制toast 3s消失</view>  
<view bindtap="testToast" data-test="31">指定duration=10s,手动2s后关闭toast</view>  
  
<view bindtap="testToast" data-test="4">指定mask,控制toast遮罩</view>  
  
<view bindtap="testToast" data-test="5">指定cb, 控制回调处理业务</view> -->
  <view class="bu" bindtap="testToast" data-test="5">
        确定
      </view>


 
  
  testToast: function (e) {
    var test = e.target.dataset.test;
    if (test == 1) {
      feedbackApi.showToast({ title: 'test shoToast title' })//调用  
    }
    if (test == 2) {
      feedbackApi.showToast({
        title: 'test shoToast title',
        icon: '/pages/templateImg/loading.gif'
      })
    }
    if (test == 3) {
      feedbackApi.showToast({
        title: 'test shoToast title',
        duration: 3000
      })
    }
    if (test == 31) {
      feedbackApi.showToast({
        title: 'test shoToast title',
        duration: 10000
      })
      setTimeout(function () {
        feedbackApi.hideToast();
      }, 2000)
    }
    if (test == 4) {
      feedbackApi.showToast({
        title: 'test shoToast title',
        mask: false
      })
    }
    if (test == 5) {
      var that=this;
      feedbackApi.showToast({
        title: '访客密码已生成',
        cb: function () {
          that.setData({
            active: 1,
          //  sharedetail:1,
          })
        }
      })
      setTimeout(function () {
        feedbackApi.hideToast();
      }, 2000)
    }
  },  


猜你喜欢

转载自blog.csdn.net/qq_23064501/article/details/78854339
今日推荐