一:wx.showToast()
-
var pageObject = {
-
onLoad: function () {
-
wx.showToast({
-
title: '成功', //标题
-
icon: 'loading', //图标,支持"success"、"loading"
-
image: '../image/img.png', //自定义图标的本地路径,image 的优先级高于 icon
-
duration: 2000000, //提示的延迟时间,单位毫秒,默认:1500
-
mask: false, //是否显示透明蒙层,防止触摸穿透,默认:false
-
success: function () { }, //接口调用成功的回调函数
-
fail: function () { }, //接口调用失败的回调函数
-
complete: function () { } //接口调用结束的回调函数
-
})
-
}
-
}
-
Page(pageObject)
二:action-sheet 反馈上拉菜单
//js
-
var items = ['item1', 'item2', 'item3', 'item4']
-
var pageObject = {
-
data: {
-
actionSheetHidden: true,
-
actionSheetItems: items
-
},
-
actionSheetTap: function (e) {
-
this.setData({
-
actionSheetHidden: !this.data.actionSheetHidden
-
})
-
},
-
actionSheetChange: function (e) {
-
this.setData({
-
actionSheetHidden: !this.data.actionSheetHidden
-
})
-
}
-
}
-
for (var i = 0; i < items.length; ++i) {
-
(function (itemName) {
-
pageObject['bind' + itemName] = function (e) {
-
console.log('click' + itemName, e)
-
}
-
})(items[i])
-
}
-
Page(pageObject)
//wxml
-
<button type="default" bindtap="actionSheetTap">弹出action sheet</button>
-
<action-sheet hidden="{{actionSheetHidden}}" bindchange="actionSheetChange">
-
<block wx:for-items="{{actionSheetItems}}">
-
<action-sheet-item class="item" bindtap="bind{{item}}">{{item}}</action-sheet-item>
-
</block>
-
<action-sheet-cancel class="cancel">取消</action-sheet-cancel>
-
</action-sheet>
三:js动态给前台元素绑定事件
//js动态给前台绑定事件
-
var myList = ["items1","items2","items3"]
-
pageObject = {
-
data:{
-
actionSheetItems:myList
-
}
-
}
-
for(var i = 0;i < myList.length;++i){
-
(function(itemName){
-
pageObject[itemName] = function(e){
-
//pageObject['<span><span class="string">bind</span></span>'+itemName] 事件名称
-
//function(){}事件主体
-
}
-
})(myList[i])
-
}
-
Page(pageObject)
//wxml
-
<block>
-
<action-sheet hidden="false">
-
<block wx:for-items="{{actionSheetItems}}">
-
<action-sheet-item bindtap="{{item}}">{{item}}</action-sheet-item>
-
</block>
-
<action-sheet-cancel class="cancel">取消</action-sheet-cancel>
-
</action-sheet>
-
</block>