微信小程序组件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】1635: [Usaco2007 Jan]Tallest Cow 最高的牛(差分序列)
http://www.lydsy.com/JudgeOnline/problem.php?id=1635 差分序列是个好东西啊....很多地方都用了啊,,, 线性的进行区间操作orz 有题可知 h[a ...
- SharePoint Survey WebPart 调查 Web部件
SharePoint Survey WebPart 调查 Web部件 Web部件下载地址 点击此处下载. 安装激活Web部件 过程简单此处省略. 项目描写叙述 调查是SharePoint中协同门户的一 ...
- 曲线学习PyQt5方案一
PyQt5官方网站没直接给出API,这个很操蛋啊. PtQt4官方网站有完整的API,C++版本的Qt5也能找到完整的API资料.由于Qt5的C++和Python3的类和函数实现应该是一致的,所以可以 ...
- Oracel 数据库面试题
1.取出表中第31到40行的记录mysql方案: , oracle方案: select t2.* ) t2 2.truncate和delete有什么区别TRUNCATE TABLE在功能上与不带WHE ...
- hdu 1233:还是畅通工程(数据结构,图,最小生成树,普里姆(Prim)算法)
还是畅通工程 Time Limit : 4000/2000ms (Java/Other) Memory Limit : 65536/32768K (Java/Other) Total Submis ...
- React + Redux 入门(一):抛开 React 学 Redux
http://www.hacke2.cn/think-in-react-redux-1/
- ASP.NET MVC 随想录
http://www.cnblogs.com/OceanEyes/category/696137.html
- Struts2_day04--课程介绍_Struts2拦截器概述&底层原理_重要的概念
Struts2_day04 上节内容 今天内容 Struts2拦截器概述 拦截器底层原理 重要的概念 自定义拦截器 自定义登录拦截器 Struts2的标签库 Struts2表单标签(会用) Strut ...
- Java中分页功能源码实例
一.源码(后附使用说明) package com.zhiyou100.crm.util; /** * 分页功能 * @author YangXianSheng * */ public class Pa ...
- Web测试系列之测试工具
一Web功能测试工具MAXQ MAXQ是开源的Web功能测试工具. MAXQ是开源的Web功能测试工具.他的特点:1)简单易学;2)是一个轻量级的Web功能测试工具;3)可以自动录制WebBrowse ...