zoukankan      html  css  js  c++  java
  • 微信小程序点击按钮 弹出底部上拉菜单

    //index.wxml
    
    <button type="default" bindtap="actionSheetTap">弹出action sheet</button>
    <action-sheet hidden="{{actionSheetHidden}}" bindchange="actionSheetbindchange">
        <block wx:for-items="{{actionSheetItems}}">
            <action-sheet-item bindtap="bind{{item.bindtap}}">{{item.txt}}</action-sheet-item>
        </block>
        <action-sheet-cancel class="cancel">取消</action-sheet-cancel>
    </action-sheet>
    <view>
        提示:您选择了菜单{{menu}}
    </view>
    //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
        })
      }
    })
  • 相关阅读:
    nginx路径详解
    负载均衡
    http中消息头的安全配置及工作原理
    Tomcat的ErrorPage实现原理分析及阀门ErrorReportValve
    Tomcat中Logger组件
    NIO在Tomcat中的应用
    vue中强制生效css样式
    k8s中的Ingress
    xhr.withCredentials与 CORS 什么关系
    Redis Cluster集群
  • 原文地址:https://www.cnblogs.com/panlaixing/p/6744035.html
Copyright © 2011-2022 走看看