微信小程序例子——使用action-sheet弹出小程序底部菜单

1、效果展示

2、关键代码

1、index.wxml

弹出action sheet
{{item.txt}}取消
    提示：您选择了菜单{{menu}}

2、index.js

Page({
  data:{
    // text:"这是一个页面"
    actionSheetHidden:true,
    actionSheetItems:[
      {bindtap:'Menu1',txt:'菜单1'},
      {bindtap:'Menu2',txt:'菜单2'},
      {bindtap:'Menu3',txt:'菜单3'}
    ],
    menu:''
  },
  actionSheetTap:function(){
    this.setData({
      actionSheetHidden:!this.data.actionSheetHidden
    })
  },
  actionSheetbindchange:function(){
    this.setData({
      actionSheetHidden:!this.data.actionSheetHidden
    })
  },
  bindMenu1:function(){
    this.setData({
      menu:1,
      actionSheetHidden:!this.data.actionSheetHidden
    })
  },
  bindMenu2:function(){
    this.setData({
      menu:2,
      actionSheetHidden:!this.data.actionSheetHidden
    })
  },
  bindMenu3:function(){
    this.setData({
      menu:3,
      actionSheetHidden:!this.data.actionSheetHidden
    })
  }
})

3、源代码获取方式

百度云链接：http://pan.baidu.com/s/1nv4idZj