这篇文章是教大家如何使用微信小程序的提示框?教程简单易学,有需要的小伙伴就赶紧和酷牛教程小编一起来学习一下吧。
比较简单 直接上码
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)
})
复制代码
以上就是如何使用微信小程序的提示框的全部内容了,大家都学会了吗?
本文来自投稿,不代表酷牛教程立场,如若转载,请注明出处:https://www.xukn.com/97405.html