action-sheet:从屏幕底部弹出一个菜单,选择:

使用的时候,在给不同的 action-sheet-item 添加不同的事件。

效果: (这里的确定可以有多个)

代码:

<button type="primary" bindtap="btnclick">按钮</button>
<action-sheet hidden="{{onOff}}">
<action-sheet-item class='item'>确定</action-sheet-item>
<action-sheet-cancel class='cancel'>取消</action-sheet-cancel>
</action-sheet>

JS:

//获取应用实例
const app = getApp()
Page({
data: {
onOff:false
},
btnclick:function(){
this.setData({onOff:false});
}
})

微信小程序 --- action-sheet底部弹框的更多相关文章

  1. 微信小程序之自定义底部弹出框动画

    最近做小程序时,会经常用到各种弹框.直接做显示和隐藏虽然也能达到效果,但是体验性太差,也比较简单粗暴.想要美美地玩,添加点动画还是非常有必要的.下面做一个底部上滑的弹框. wxml <view ...

  2. 微信小程序中的常见弹框

    显示加载中的提示框 wx.showLoading() 当我们正在在进行网络请求时,常常就需要这个提示框 手动调用wx.hideLoading()方法才能够关闭这个提示框,通常在数据请求完毕时就应该关闭 ...

  3. 图解微信小程序---添加tabBar底部菜单,添加已做好轮播图操作

    图解微信小程序---添加tabBar底部菜单,添加已做好轮播图操作 什么是tabBar? 顶部或者底部tab栏如果小程序是一个多 tab 应用(客户端窗口的底部或顶部有 tab 栏可以切换页面),可以 ...

  4. 微信小程序自定义组件-下拉框

    这个是网址https://www.cnblogs.com/zjjDaily/p/9548433.html 微信小程序之自定义select下拉选项框组件 知识点:组件,animation,获取当前点击元 ...

  5. 微信小程序组件 加减号弹出框

    <!-- 点击立即抢拼弹出框 --> <view class='add-rob' bindtap="setModalStatus" data-status=&qu ...

  6. 转:【微信小程序常见问题】下拉框选择器设置picker属性。(包括:城市、日期和时间选择器)

    1.picker写法(支持日期Date.时间Time和城市自定义) wxml文件 <picker bindchange="bindPickerChange" value=&q ...

  7. 微信小程序 滚动到底部

    1.html <view id="bottom"></view> 2. onReady: function () { //滚动到底部 let query = ...

  8. 微信小程序-下拉松开弹不回去顶部留一段空白

    解决办法: 空白的出现有可能是多次触发下拉事件导致请求过多导致页面反应延迟. 在 onPullDownRefresh 事件里加setTimeout事件延迟下下拉刷新的事件. /** * 页面相关事件处 ...

  9. 微信小程序 添加左边固定浮动框

    view: <!-- 悬浮框 --> <view class="v-fixed-title1"> <view class="v-fixed- ...

  10. 微信小程序避坑指南——input框里的图标在部分安卓机里无法点击的问题

    问题场景: 下图中的显隐密码和验证码均为包裹在 input标签 中的 image标签, 但在开发测试中发现点击不了这俩个image标签,因为是被input标签的padding挡住了. 解决方法:将im ...

随机推荐

  1. tensorflow 单机多GPU mnist实例

    http://blog.csdn.net/guotong1988/article/details/74748806 如何使用多GPU http://wiki.jikexueyuan.com/proje ...

  2. debian下系列下的apt-get 命令与deb包的手动安装的dpkg命令

    手动下载的deb包的相关操作: 操作deb 使用dpkg 命令工具, dpkg 是Debian package的简写. 下面列举常用的 操作: dpkg –I name.deb  查看 包的详细信息( ...

  3. unity3d绘画手册-------地形高度调节

    高度 所有地形 (terrain) 编辑工具的使用都很简单.您可以在场景视图 (scene view)中逐步绘制地形 (terrain).对于高度工具和其他所有工具,您只需选中工具,然后在场景视图 ( ...

  4. Sublime Text 3安装清爽主题(著名的Soda Theme)

    Sublime Text是一款强大的编辑器,不但拥有众多强大的功能,还拥有很多漂亮的主题以及大量的插件可供配置使用. 本文主要描述Sublime Text 3安装清爽的主题,默认的深色主题Monoka ...

  5. 说一下zoom:1的原理,万一被问到呢?

    某一天.前同事低着头从鹅厂面试回来.他说他被一道非经常见的问题难倒了. 对方问他知道zoom:1的作用吗? 前同事:清楚浮动啊,触发haslayout. 再问:那你知道zoom:1的工作原理和来龙去脉 ...

  6. alien 进行rpm 包和deb 包之间的转换

    今天安装一个pandoc, 官方只提供了一个deb 的二进制包,为了在redhat 上安装,需要将deb 包转换成rpm 包. 使用工具alien : http://ftp.de.debian.org ...

  7. dom元素改变监听

    function domChange(domId, callback) { // select the target node var target = document.getElementById ...

  8. 【MongoDB】数组长度查询

    db.groupedInfo.count({'surveyInfo.surveyAndUserID.0':{$exists:1}})

  9. 如何用MathType快速输入公式

    我们在写论文的时候,如果涉及到数学公式的话,我们一般都会使用MathType软件,但同时对于一些新手来说不太用使用此款软件,输入公式时就会很慢,今天教大家如何利用MathType快速输入公式. 具体方 ...

  10. OpenCV学习:图像的载入和显示

    一.使用IplImage结构读取并显示图像文件: 运行结果: 二.使用Mat类读取并显示图像文件: 使用 Mat 类,内存管理变得简单,不再像使用 IplImage 那样需要自己申请和释放内存,而且一 ...