wxml: <scroll-view scroll-y="{{isScroll}}"> ... <!-- 评论框 --> <view class='model' wx:if="{{inputBoxShow}}"> <!-- invisible_model view 用于点击隐藏model评论框 --> <view class='invisible_model' catchtap='invisible'></view> <view class='input-box'> <textarea class="textarea" placeholder="请输入你的看法" cursor-spacing="{{65}}" show-confirm-bar="{{false}}" adjust-position="{{true}}" auto-focus="{{true}}" /> <text class='send'>发送</text> </view> </view> ... </scroll-view> wxss: .model { position: fixed; width: 100vw; height: 100vh; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.4); z-index: 100; } .input-box { position: absolute; background-color: #f8f8f8; padding: 30rpx; padding-bottom: 130rpx; bottom: 0; left: 0; right: 0; z-index: 101; } .textarea { background-color: #fff; width: 100%; padding: 5rpx; height: 3.3em; font-size: 15px; position: static; } .send { font-size: 14px; margin-top: 5rpx; color: #09bb07; float: right; position: static; } .invisible_model{ position: fixed; width: 100vw; height: 100vh; top: 0; bottom: 0; } js: Page({ data: { inputBoxShow: false, isScroll: true, }, showInputBox: function () { this.setData({ inputBoxShow: true }); this.setData({ isScroll: false }); }, invisible: function(){ this.setData({ inputBoxShow: false }); this.setData({ isScroll: true }); } }) |
请发表评论