自定义app端、小程序端和H5等多端自定义键盘输入框，跟随系统键盘弹出和隐藏

1.标签代码：

<textarea class="message-input":style="'position:fixed;z-index:999;'+(keyboardHeight>=0?'bottom:'+keyboardHeight+'rpx;':'bottom:'+'0rpx')"ref="input"v-model="newPostContent":auto-focus="keyboardHeight>=0|| messageInput":placeholder="answerName"confirm-type="search"@keyup.enter="submitMessage"@confirm="submitMessage"></textarea>

2.卸载键盘时取消监听：

onUnload(){// 页面卸载时取消监听uni.offKeyboardHeightChange();},

3.监听键盘高度：

// 监听键盘高度变化uni.onKeyboardHeightChange(res=>{this.keyboardHeight=res.height;if(this.keyboardHeight>0){this.keyboardHeight-=this.inputContainerHeight;// 加上输入区域自身高度，避免遮挡}console.log('当前键盘高度:',this.keyboardHeight);});

4.全局变量：

keyboardHeight:0,// 键盘高度inputContainerHeight:200// 输入区域自身高度，用于给主内容区设置底部paddingnewPostContent:'',// 评论内容

5.css

.message-input {
width: 86%;
display: inline-block;
height: 100rpx;
box-shadow: 0 2rpx 10rpx rgb(98, 98, 98,0.3);
background: rgba(255, 255, 255, 0.14);
border-radius: 5px;
padding: 10px;
margin-bottom: 10px;
}