本章节主要介绍了如何使用微信小程序的显示消息提示组件?操作起来也比较简单，还不会的朋友一起跟着小编学习一下吧，希望对你们有所帮助。
组件说明:
Toast是当用户点击某些组件时弹出来来的提示消息。Toast会帮助你创建和显示这些消息。Toast是一种简易的消息提示框。当视图显示给用户，在应用程序中显示为浮动。小程序即将废弃Toast组件，故这里介绍Toast的API：wx.showToast
组件用法：
wxml
复制代码
js
Page({
showToast:function(){
var that=this;
wx.showToast({
title: \'成功\',
icon: \'success\',
duration: 2000,
success: that.flySuccess,
fail:that.flyFail,
complete:that.flyComplete
})
},
hideToast:function(){
var that=this;
wx.showToast({
title: \'加载中\',
icon: \'loading\',
duration: 10000,
success: that.loadingSuccess,
fail:that.loadingFail,
complete:that.loadingComplete
});
setTimeout(function(){
wx.hideToast()
},2000)
},
flySuccess:function(e){
console.log(e);
console.log("起飞成功！");
},
flyFail:function(e){
console.log(e);
console.log("起飞失败！")
},
flyComplete:function(e){
console.log(e);
console.log("起飞结束！")
},
loadingSuccess:function(e){
console.log(e);
console.log("加载成功！");
},
loadingFail:function(e){
console.log(e);
console.log("加载失败！")
},
loadingComplete:function(e){
console.log(e);
console.log("加载结束！")
}
})
复制代码
wxss
/**index.wxss**/
.con-button{
display: flex;
flex-direction: row;
padding-top: 10%;
}
.showfunc{
padding-top:10%;
display: block;
text-align: center;
color: green;
}
复制代码
以上就是如何使用微信小程序的显示消息提示组件的全部内容了，大家都学会了吗?
End