事件
touchstart 手指触摸动作开始
touchmove 手指触摸后移动
touchcancel 手指触摸动作被打断,如来电提醒,弹窗
touchend 手指触摸动作结束
tap 手指触摸后马上离开
longpress 手指触摸后,超过350ms再离开,如果指定了事件回调函数并触发了这个事件,tap事件将不被触发 1.5.0
longtap 手指触摸后,超过350ms再离开(推荐使用longpress事件代替)
transitionend 会在 WXSS transition 或 wx.createAnimation 动画结束后触发
animationstart 会在一个 WXSS animation 动画开始时触发
animationiteration 会在一个 WXSS animation 一次迭代结束时触发
animationend 会在一个 WXSS animation 动画完成时触发
touchforcechange 在支持 3D Touch 的 iPhone 设备,重按时会触发
可以通过bind 和 catch 来绑定事件catch 会阻止事件向上冒泡。
1. 页面上通过自定义属性传递参数;
<view bindtap="getCityagent" data-index="3" class="posr z-col-xs-3 z_mb15">
<view class="z_font12 z_color_6">城市代理</view>
</view>
getCityagent(e) {
let type = this.data.userInfo.type;
let ctiyURL = "/pages/storeEntryApplication/storeEntryApplication"
let index = e.currentTarget.dataset['index']; //3 获取data-index绑定的值
},
2. 默认是单向数据绑定 <input value="{{a}}" />
3.input 获取值 双向数据绑定
<1> 通过事件 bindinput 事件,可以是对象属性形式
<input bindinput="changName" value="{{userInfo.name}}" />
changName(e){
this.setData({
"userInfo.name":e.detail.value
})
}
<2> 只支持单一字段 <input model:value="{{a}}" />
普通picker组件快速结构
// .wxml jobList数组对象 “name”显示的key
<picker bindchange="bindPickerChange" data-type="1" value="{{jobValue}}" range="{{jobList}}" range-key="name">
<view class="picker">
<input type="text" placeholder="请选择行业" disabled value="{{jobValue}}" class="z_input z_font14" />
</view>
</picker>
// .js
bindPickerChange: function(e) {
let that = this;
let type = e.currentTarget.dataset['type'];
let index = e.detail.value;
if(type ==1){
let filterList = that.data.jobList.filter((item,key)=>{
return index == key
})
this.setData({
"userInfo.job_id": filterList[0].id,
jobValue:filterList[0].name
})
}
if(type ==2){
let filterList = that.data.educationList.filter((item,key)=>{
return index == key
})
this.setData({
"userInfo.education_id": filterList[0].id,
educationValue:filterList[0].name
})
}
},
请求方法封装
1、http请求封装
// 签名方式根据实际情况而定;
app.ajax = (url,data={},isloading=1,method="post")=>{
if(!url){return false}
if(isloading){
wx.showLoading({title: '加载中'})
}
let userobj = app.myCookie('userobj', '');
if(userobj){
data["user_id"] = userobj.id;
data["token"] = userobj.token;
}else{
data["user_id"] = ""
data["token"] = ""
}
let dataJsonString = JSON.stringify(data)
let apisign = md5('加密的key'+ dataJsonString)
let sendData={
data:dataJsonString,
apisign:apisign
}
return new Promise((resolve,reject)=>{
wx.request({
url: URlList.host + url,
method:method,
dataType:"json",
data:sendData,
header: {
'Content-Type': 'application/json'
},
complete:()=>{
if(isloading){
wx.hideLoading();
}
},
fail:(res)=>{
app.myalert('请求失败,请稍后再试!')
reject(res)
},
success:(res)=>{
let result = res.data
if (result.status == 1010) {
wx.clearStorageSync();
myalert(result.info);
wx.reLaunch({
url: "/page/login/login",
})
}
if(result.status !=1){
wx.showToast({
title: result.info,
icon: 'none'
})
}
resolve(result)
}
})
})
}
// 调用
myapp.ajax(url)
.then(res=>{
....
})
2、上传文件封装
cardImageEdit() {
let that = this;
new Promise((resolve, reject) => {
wx.chooseImage({
count: 1, // 默认9 最多可以选择的图片张数
sizeType: ['original', 'compressed'], // 所选的图片的尺寸
sourceType: ['album', 'camera'], //选择图片的来源
success: function (res) {
resolve(res)
},
fail: function(err){
reject(err)
}
});
}).then(res => {
let filePath = res.tempFilePaths;
myapp.showLoading("上传中...", true)
return new Promise((resolve, reject) => {
wx.uploadFile({
filePath: filePath[0],
name: "file",
url: api.host + api.Upload.fileUpload,
formData: {
name: 'file',
return_array: 0
},
success: (res) => {
resolve(res)
},
fail(err) {
myapp.myalert(err)
reject(err)
},
complete() {
myapp.hideLoading()
}
})
})
}).then(res => {
console.log('地址', res)
let result = JSON.parse(res.data);
let data = {
image: result.data.url
}
myapp.ajax(api.Card.cardImageEdit, data)
.then(res => {
if (res.status == 1) {
myapp.myalert(res.info)
that.setData({
"cardData.image": result.data.url
})
}
})
})
},