微信小程序组件toast
操作反馈toast:官方文档
Demo Code:
var toastNum = 2
var pageData = {}
pageData.data = {}
for(var i = 0; i <= toastNum; ++i) {
pageData.data['toast'+i+'Hidden'] = true;
(function (index) {
pageData['toast'+index+'Change'] = function(e) {
var obj = {}
obj['toast'+index+'Hidden'] = true
this.setData(obj)
}
pageData['toast'+index+'Tap'] = function(e) {
var obj = {}
obj['toast'+index+'Hidden'] = false
this.setData(obj)
}
})(i)
}
Page(pageData);
JS
<view class="body-view">
<toast hidden="{{toast1Hidden}}" bindchange="toast1Change">
默认
</toast>
<button type="default" bindtap="toast1Tap">点击弹出默认toast</button>
</view>
<view class="body-view">
<toast hidden="{{toast2Hidden}}" duration="3000" bindchange="toast2Change">
设置duration
</toast>
<button type="default" bindtap="toast2Tap">点击弹出设置duration的toast</button>
</view>
WXML
.body-view{
font-family:"Helvetica Neue","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53",Arial,sans-serif;
}
button{
margin-top: 10px;
}
WXSS
微信小程序组件toast的更多相关文章
- 微信小程序组件设计规范
微信小程序组件设计规范 组件化开发的思想贯穿着我开发设计过程的始终.在过去很长一段时间里,我都受益于这种思想. 组件可复用 - 减少了重复代码量 组件做为抽离的功能单元 - 方便维护 组件作为temp ...
- 微信小程序组件学习 -- 注册页面
微信小程序组件使用手册地址: 1. 百度搜索"微信公众平台",扫码登录之后,点击帮助文档里面的普通小程序. 2. 接着选择"开发"-->"组件& ...
- 微信小程序组件化实践
Do Not Repeat Yourself 如何提高代码质量,方法有许多:抽象.模块.组件化,我认为它们的中心点都是--Do Not Repeat Yourself. 小程序组件化 我们先看看小程序 ...
- 微信小程序自定义toast的实现
今天写微信小程序突然发现一个尴尬的问题,请求报错需要提示,就去小程序API里找,可悲的小程序的toast并不能满足我的需求,原生提供的方法调用如下 wx.showToast({ title: '成功' ...
- 【腾讯Bugly干货分享】打造“微信小程序”组件化开发框架
本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2nQzsuqq7Avgs8wsRizUhw 作者:Gc ...
- 微信小程序(组件demo)以及预览方法:(小程序交流群:604788754)
1. 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的"设置"-"开发者设置"中,查看到微信小程序的 Ap ...
- 详解封装微信小程序组件及小程序坑(附带解决方案)
一.序 上一篇介绍了如何从零开发微信小程序,博客园审核变智障了,每次代码都不算篇幅,好好滴一篇原创,不到3分钟从首页移出来了.这篇介绍一下组件封装和我的踩坑历程. 二.封装微信小程序可复用组件 首先模 ...
- 微信小程序组件通信
父子通信 在子组件的对应js中 properties:{ prop名字:数据类型, prop名字:{ type:数据类型, value:默认值 } } 在父组件的wxml模板中找到子组件标签 < ...
- 微信小程序——组件(二)
在上篇文章组件(一)里已经讲解了如何创建一个项目,现在继续...讲解一个页面布局以及各个组件的使用.在学习过程中,发现小程序支持flex布局,这对于学习过react native的人来说太好了,布局方 ...
随机推荐
- 【BZOJ】1666: [Usaco2006 Oct]Another Cow Number Game 奶牛的数字游戏(刷水严重)
http://www.lydsy.com/JudgeOnline/problem.php?id=1666 这种我就不说了.. #include <cstdio> #include < ...
- mongoose 数据库操作3
Model.find(query, fields, options, callback) Model.find({ 'some.value': 5 }, function (err, docs) { ...
- 百家搜索:在站点中加入Google、百度等搜索引擎
来源:http://www.ido321.com/1143.html 看到一些站点上加入了各种搜索引擎. 如Google.百度.360.有道等.就有点好奇.这个怎么实现?研究了一各个搜索引擎怎么传送k ...
- 配置sudo su
买了UCloud的机器默认给的是root权限,从安全考虑,这个得改改,那就添加一个普通用户吧.. 可是那群民工又有话说了,得有root权限才能启动那些服务进程,每次都要输入root密码才能切换到roo ...
- zoj 3362(最大费用)
题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=3904 思路:费用流的题,增加一个超级源点和一个超级汇点,然后就是连边 ...
- 简单配置Nginx 指向本地端口,并开启SSL
简单配置Nginx 指向本地端口,并开启SSL,如果要开启SSL,必须使用域名去申请SSL key,一般是两个文件,一般是要收费的. # 在/etc/nginx/nginx.conf 的文件中有下面一 ...
- Oracle 10g 数据库手动创建步骤
Oracle 数据库手动创建步骤 编写初始化参数文件 设置操作系统环境变量 创建实例 以管理员身份连接数据库 启动实例 create database 创建数据库 运行数据字典脚本 Oracle的网络 ...
- -pie can only be used when targeting iOS 4.2 or later
网上下载的demo,执行报错-pie can only be used when targeting iOS 4.2 or later 解决的方法:选择target==>改动developmen ...
- 分页技巧__在项目中使用QueryHelper辅助对象实现分页效果
分页技巧__在项目中使用QueryHelper辅助对象实现分页效果 QueryHelper 用于辅助拼接HQL语句 addCondition("t.type=?", "精 ...
- Hadoop1.2.1 伪分布式安装
Hadoop1.2.1 单机模式安装 Hadoop组件依赖图(从下往上看) 安装步骤: 详细步骤: 设置ssh自动登录(如下图): 1.输入命令 [ssh-keygen -t rsa],然后一直按回车 ...