排名不分先后，按自己的习惯来的。
总结经验，不喜勿喷哦~
一、tab切换<view data-current="0" bindtap="swichNav"> tab1</view> <view data-current="1" bindtap="swichNav"> tab2</view> Page({ data:{ // tab切换 currentTab: 0, }, swichNav: function (e) { var that = this; if (this.data.currentTab === e.target.dataset.current) { return false; } else { that.setData({ currentTab: e.target.dataset.current }) } }, })
二、swiper切换<view> <text data-current="0" bindtap="swichNav">tab1</text> <text data-current="1" bindtap="swichNav">tab2 </text> <text data-current="2" bindtap="swichNav">tab3 </text> </view> <swiper current="{{currentTab}}" bindchange="bindChange"> <swiper-item>页面1</swiper-item> <swiper-item>页面2</swiper-item> <swiper-item>页面3</swiper-item> </swiper> Page({ data:{ currentTab: 0, aheight: '' }, // 滑动切换 bindChange: function (e) { var that = this; that.setData({ currentTab: e.detail.current }); }, //点击tab切换 swichNav: function (e) { var that = this; if (this.data.currentTab === e.target.dataset.current) { return false; } else { that.setData({ currentTab: e.target.dataset.current }) } }, // swiper 自适应高度 onLoad: function (options) { var that = this wx.getSystemInfo({ success: function (res) { that.setData({ aheight: res.screenHeight }); } }) }, })
三、图片上传<view> <block wx:for="{{img_arr}}" wx:key="{{item.id}}" bindtap="del"> <view data-index="{{index}}"> <view> <image src="https://192.168.2.61/wx_ry/del.png" mode="widthFix" bindtap="deleteImage"></image> </view> <image src='https://www.jb51.net/{{item}}' mode="widthFix"></image> </view> </block> <view> <image src="https://192.168.2.61/wx_ry/add.png" mode="widthFix" bindtap="upimg"></image> </view> </view> .upload { width: 20%; float: left; margin-top:33rpx ; } .upload image{ width: 100%; } .logoinfo{ width: 20%; float: left; margin-right:2% ; } .del{ width: 20%; float: right; } .del image{ width: 100%; } .logoinfo image{ width: 100%; } page({ data:{ img_arr: [] }, // 图片上传 upimg: function () { var that = this; if (this.data.img_arr.length < 3) { wx.chooseImage({ sizeType: ['original', 'compressed'], success: function (res) { that.setData({ img_arr: that.data.img_arr.concat(res.tempFilePaths), }) } }) } else { wx.showToast({ title: '最多上传三张图片', icon: 'loading', duration: 3000 }); } }, // 删除图片 deleteImage: function (e) { var that = this; var index = e.currentTarget.dataset.index; //获取当前长按图片下标 console.log(that.data.img_arr) wx.showModal({ title: '提示', content: '确定要删除此图片吗？', success: function (res) { if (res.confirm) { console.log('点击确定了'); that.data.img_arr.splice(index, 1); } else if (res.cancel) { console.log('点击取消了'); return false; } that.setData({ img_arr: that.data.img_arr }); } }) }, // 上传 upload: function () { var that = this for (var i = 0; i < this.data.img_arr.length; i++) { wx.uploadFile({ url: 'https:***/submit', filePath: that.data.img_arr[i], name: 'content', formData: adds, success: function (res) { console.log(res) if (res) { wx.showToast({ title: '已提交发布！', duration: 3000 }); } } }) } this.setData({ formdata: '' }) }, // 提交 formSubmit: function (e) { console.log('form发生了submit事件，携带数据为：', e.detail.value) } })
四、scroll-view滚动页<scroll-view scroll-x="true" bindscroll="scroll"> <view> <view>1</view> </view> <view> <view>2</view> </view> </scroll-view> .scroll-view_H{ white-space: nowrap; height: 600rpx; } .listb{ padding: 25rpx; white-space: normal; }
五、授权登录app.js
//app.js App({ globalData: { userInfo: null, unionid:null, token:'' }, onLaunch: function () { /* 已授权之后，自动获取用户信息 */ // 判断是否授权 wx.getSetting({ success: (res) => { //箭头函数为了处理this的指向问题 if (res.authSetting["scope.userInfo"]) { console.log("已授权"); // 获取用户信息 wx.getUserInfo({ success: (res) => { //箭头函数为了处理this的指向问题 // this.globalData.isok=true this.globalData.token='ok' var that =this console.log(res.userInfo); //用户信息结果 wx.getStorage({ key: 'unionid', success(res) { that.globalData.unionid=res.data } }) this.globalData.userInfo = res.userInfo; if (this.userInfoReadyCallback) { //当index.js获取到了globalData就不需要回调函数了，所以回调函数需要做做一个判断，如果app.js中有和这个回调函数，那么就对这个函数进行调用，并将请求到的结果传到index.js中 this.userInfoReadyCallback(res.userInfo); } } }) } else{ console.log("未授权"); wx.removeStorage({ key: 'unionid' }) } } }) } })
wxml
<button open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="onGotUserInfo" data-url='../yzzs/yzzs'> 防疫针助手 </button>
index.js