小编分享如何使用微信小程序的提示框。

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

比较简单 直接上码

微信小程序的提示框的简单使用方法

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

(0)
上一篇 2023-02-17 10:23
下一篇 2023-02-17 10:41

相关推荐