这篇文章是教大家如何使用微信小程序的提示框?教程简单易学,有需要的小伙伴就赶紧和小编一起来学习一下吧。
比较简单 直接上码

Toast框
提示框
成功提示
取消提示
禁止提示
文本提示
复制代码
js
const App = getApp()
Page({
data: {},
onLoad() {
this.$wuxToast = App.wux(this).$wuxToast
},
showToast() {
const _this =this;
_this.$wuxToast.show({
type: \'success\',
timer: 1500,
color: \'#fff\',
text: \'已完成\',
// 成功之后的返回,想当于下面的success
success: () => console.log(\'已完成\')
// success: function(){
// console.log(\'已完成\')
// }
})
},
showToastCancel() {
const _this =this;
_this.$wuxToast.show({
type: \'cancel\',
timer: 1500,
color: \'#fff\',
text: \'取消操作\',
success: () => console.log(\'取消操作\')
})
},
showToastErr() {
const _this =this;
_this.$wuxToast.show({
type: \'forbidden\',
timer: 1500,
color: \'#fff\',
text: \'禁止操作\',
success: () => console.log(\'禁止操作\')
})
},
showToastText() {
const _this =this;
_this.$wuxToast.show({
type: \'text\',
timer: 1500,
color: \'#fff\',
text: \'文本内容\',
success: () => console.log(\'文本内容\')
})
},
})
复制代码
注意点
在app.js中要引入wxui
import wux from \'components/wux\'
App({
onLaunch() {
console.log(\'onLaunch\')
},
onShow() {
console.log(\'onShow\')
},
onHide() {
console.log(\'onHide\')
},
// 通过scope来引入wux函数
wux: (scope) => new wux(scope)
})
复制代码
以上就是如何使用微信小程序的提示框的全部内容了,大家都学会了吗?