wxml
<viewclass='{{!modalFlag?"scan-book":"scan-books"}}'catchtap='scanbookTap'>
<viewclass='{{!modalFlag?"buttonPicker_screen_main":"buttonPicker_screen_mains"}}'>
</view>
</view>
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。
wxss
.scan-book {
width:750rpx;
height:100%;
background:rgba(0, 0, 0, 0.7);
position:fixed;
z-index:2000;
top:0;
}
.scan-books {
display:none;
}
.buttonPicker_screen_main {
border:1pxsolid#dedede;
width:700rpx;
height:400rpx;
position:fixed;
top:0;
left:0;
right:0;
background:white;
overflow:hidden;
display:flex;
flex-direction:column;
display:-webkit-flex;
justify-content:center;
margin:0auto;
color:white;
margin-top:180rpx;
}
.buttonPicker_screen_mains {
display:none;
}
。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。js
data: {
modalFlag: true,
},
scanbookTap: function () {
this.setData({ modalFlag: true, })
},