微信小程序开发之吐司toast(消息提示框)
2017-07-21 17:07
567 查看
做Android的时候对toast是很熟悉的.微信小程序开发中吐司也是重要的消息提示方式.
上代码:
1.index.wxml
toast是微信提供的组件,duration是延迟时间,单位毫秒.这里设置是1000ms.bindchange是事件.在index.js中触发事件即可.
先在data中定义参数,toastHidden(吐司是否显示),toastText(吐司文本),函数onToastChanged(),当toastHidden变化为时执行,也就是为false时置为true;不加函数吐司不会消失.
http://blog.csdn.net/qq_31383345
上代码:
1.index.wxml
toast是微信提供的组件,duration是延迟时间,单位毫秒.这里设置是1000ms.bindchange是事件.在index.js中触发事件即可.
<!--index.wxml--> <toast hidden="{{toastHidden}}" duration="1000" bindchange="onToastChanged"> {{toastText}} </toast>2.index.js
先在data中定义参数,toastHidden(吐司是否显示),toastText(吐司文本),函数onToastChanged(),当toastHidden变化为时执行,也就是为false时置为true;不加函数吐司不会消失.
//index.js //获取应用实例 var app = getApp() Page( { data: { toastHidden: true, //吐司 toastText: '',//吐司文本 }, onToastChanged: function() { this.setData( { toastHidden: !this.data.toastHidden }); }, onLoad: function() { this.setData( { toastHidden: false, //吐司 toastText: '我是吐司',//吐司文本 }) } })我是直接在页面初始化(onLoad:function)时执行,可根据自己需求赋值给toastHidden和toastText.
http://blog.csdn.net/qq_31383345
相关文章推荐
- 微信小程序开发之吐司toast(消息提示框)
- 微信小程序之----消息提示框toast
- 微信小程序开发(三)- 显示 loading 提示框
- 微信小程序开发模板消息的时候 出现 errcode: 41028, errmsg: "invalid form id hint:
- 微信小程序 自定义消息提示框
- 微信小程序开发之模板消息
- 微信小程序开发:设置消息推送
- 微信小程序开发之formId使用(模板消息)
- 微信小程序使用toast消息对话框提示用户忘记输入用户名或密码功能【附源码下载】
- 微信小程序 自定义消息提示框
- 微信小程序开发常用技巧(7)——实现一个类似于Android toast效果动画
- 微信程序开发系列教程(二)使用JavaScript给微信用户发送消息
- 微信小程序开发之——wx.showToast(OBJECT)的使用
- 微信程序开发系列教程(三)使用微信API给微信用户发文本消息
- 微信小程序例子——使用toast消息对话框提示用户忘记输入用户名或密码
- 微信小程序开发之formId使用(模板消息)
- 【微信小程序常识】wx.showToast消息显示框手机预览失败原因
- 微信小程序开发之toast提示插件使用示例
- 微信小程序开发之formId使用(模板消息)、跨页面获取数据示例