uniapp textarea输入框软键盘遮挡问题

一、首先说下我的页面布局，总盒子高度设置了height:100vh，页面有导航栏，内容滚动区，底部包裹输入框的元素，其中：
       1、导航栏设置固定定位top:0，padding-top为menuButtonBounding.top,height为menuButtonBounding.height;

       2、内容滚动区域设置height:0,flex:1;
       3、底部输入框父元素动态设置height,无定位
二、问题描述：在手机上输入内容，内容多行后软键盘会遮挡内容导致展示不全；
                         之前设置了底部元素一个固定高度150rpx,也监听了软键盘高度变化并设置软键盘高度值，具体代码如下
 

// 监听键盘高度

        keyboardHeightChange() {

            const self = this;

            uni.onKeyboardHeightChange(res => {

                self.keyboardHeight = rpxUtil.rpxTopx(res.height);

                if (self.keyboardHeight <= 0) {

                    self.keyboardHeight = 0;

                }

                self.goBottom();

            })

        },

动态设置底部输入框部分高度为固定高度150 + 软键盘高度 keyboardHeight的值；
问题是textarea设置了:auto-height="true"，所以超过一定高度会遮挡

三、问题解决：

       在textarea的换行方法@linechange="listenTextAreaHeight"中监听底部盒子的高度，动态设置高度，具体代码如下：
 

    // 监听发送栏高度

            listenTextAreaHeight() {

                setTimeout(() => {

                    this.getElementHeight()

                }, 10)

            },

            //获取高度方法

            getElementHeight() {

                const query = uni.createSelectorQuery().in(this);

                query.select('.submit').boundingClientRect(data => {

                    this.$emit('heights', data.height);

                }).exec();

            },
由于我这个组件是分开写的所以用到了emit传值，在父组件中拿到这个高度设置底部框高度为该自身高度+软键盘高度即可。