界面常用的相关API
界面加载时常用的
- index.wxml
代码如下(示例):
<!--pages/cards/index.wxml-->
<view>
界面常用的相关API
</view>
<button bindtap="showLoading">显示加载框</button>
<button bindtap="hideLoading">隐藏加载框</button>
<button bindtap="showModal">确认框</button>
<button bindtap="showToast">提示框</button>
<button bindtap="showActionSheet">选择框</button>
<button bindtap="setBarTitle">设置页面的标题</button>
<button bindtap="setBarLoading">设置bar加载效果</button>
<button bindtap="cancelBarLoading">取消bar加载效果</button>
<button bindtap="hideTabbar">隐藏 tabbar</button>
<button bindtap="showTabbar">显示 tabbar</button>
- index.js
代码如下(示例):
Page({
showLoading: function () {
wx.showLoading({
// mask:true,
title: '加载中',
});
},
hideLoading: function () {
wx.hideLoading();
},
showModal: function () {
wx.showModal({
title: '提示',
content: '这是一个模态弹窗',
success(res) {
if (res.confirm) {
console.log('用户点击确定');
} else if (res.cancel) {
console.log('用户点击取消');
}
},
});
},
showToast: function () {
wx.showToast({
title: '成功',
icon: 'success',
duration: 2000,
});
},
showActionSheet: function () {
wx.showActionSheet({
itemList: ['苹果', '香蕉', '栗子'],
success(res) {
console.log(res.tapIndex);
},
fail(res) {
console.log(res.errMsg);
},
});
},
setBarTitle: function () {
wx.setNavigationBarTitle({
title: '设置标题',
});
},
setBarLoading: function () {
wx.showNavigationBarLoading();
},
cancelBarLoading: function () {
wx.hideNavigationBarLoading();
},
hideTabbar: function () {
wx.hideTabBar({
animation: true,
});
},
showTabbar: function () {
wx.showTabBar({
animation: true,
});
},
});