弹出框的实现

2017-09-22  本文已影响23人  幽兰清风

布局:

    <view class="container" class="zn-uploadimg">  
        <button type="primary"bindtap="modalinput">modal有输入框</button>   
    </view> 
    
    <modal hidden="{{hiddenmodalput}}" title="请输入验证码" confirm-text="提交" cancel-text="重置" bindcancel="cancel" bindconfirm="confirm">  
        <input type='text'placeholder="请输入内容" auto-focus/>  
    </modal>  

js控制

    Page({  
        data:{  
            hiddenmodalput:true,  
            //可以通过hidden是否掩藏弹出框的属性,来指定那个弹出框  
        },  
        //点击按钮弹出指定的hiddenmodalput弹出框  
        modalinput:function(){  
            this.setData({  
               hiddenmodalput: !this.data.hiddenmodalput  
            })  
        },  
        //取消按钮  
        cancel: function(){  
            this.setData({  
                hiddenmodalput: true  
            });  
        },  
        //确认  
        confirm: function(){  
            this.setData({  
                hiddenmodalput: true  
            })  
        }  
          
    }) 
上一篇下一篇

猜你喜欢

热点阅读