uni-app解决input、textarea在键盘弹起时被顶起，并在键盘上方

1，模板部分

<view class="bottom-input" :style="{bottom:`${KeyboardHeight}rpx`}">
            <view class="input-squire">
                <u--textarea
                    placeholder="请输入内容~"
                    border="none"
                    class="inputs"
                    v-model="value"
                    autoHeight
                    maxlength="-1"
                    fixed
                    :adjustPosition="false"
                  ></u--textarea>
            </view>
            <u-button class="custom-style" type="primary" text="发送" @click="sendMsg"></u-button>
        </view>

2，js部分

data() {
        return {
            value:'',
            KeyboardHeight:''
        };
},
onLoad() {
     uni.onKeyboardHeightChange(res => {
        this.KeyboardHeight = this.rpxTopx(res.height-60)
            if(this.KeyboardHeight<0)this.KeyboardHeight = 0;
     })
},
 onUnload(){
     uni.offKeyboardHeightChange()
},
methods: {
        // px转换成rpx
        rpxTopx(px){
            let deviceWidth = wx.getSystemInfoSync().windowWidth
            let rpx = ( 750 / deviceWidth ) * Number(px)
            return Math.floor(rpx)
        },
}

3，css部分

.bottom-input{
    position: absolute;
    width: 100%;
    bottom: 0;
    display: flex;
    border-top: 1px solid #F0F4F7;
    align-items: center;
    padding: 22rpx 16rpx 36rpx 20rpx;
    background-color: #fff;
    z-index: 99;
    .input-squire{
        width: 70%;
    }
    .inputs{
        background-color: #F0F4F7;
        padding-left: 20rpx;
        max-height: 120rpx;
        overflow-y: auto;
        placeholder{
            color: red;
        }
    }
    .custom-style{
        width: 18%;
        border-radius: 14rpx;
        height: 66rpx;
    }
}

参考文章：https://blog.csdn.net/qq_51250105/article/details/130221088