html

<view v-if="isShowInput" class="comment-container" :style="{ bottom: bottomHeight + 'px' }">
            <view class="comment-area-box">
                <textarea
                    class="textarea"
                    :auto-height="false"
                    auto-focus="true"
                    cursor-spacing="0"
                    :adjust-position="false"
                    :placeholder="`回复@${comment.userName || userName}`"
                    v-model.trim="replyContent"
                    @focus="handlerFocus"
                    confirm-type="send"
                    @blur="handlerBlur"
                    @confirm="sendTextMsg"
                ></textarea>
            </view>
            <view class="send_out" @tap="sendTextMsg">发送</view>
        </view>

css

.comment-container {
    margin: 0;
    padding: 20px;
    width: 100%;
    transition: all 2s inherit;
    overflow: hidden;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #ffffff;
    box-sizing: border-box;
    z-index: 1000;

    .comment-area-box {
        background: #efefef;
        border-radius: 14px;

        .textarea {
            margin: 0;
            padding: 11px 24px;
            width: calc(100% - 188px);
            height: 81px;
            line-height: 40.8px;
            outline: none;
            border-radius: 15px;
            box-sizing: content-box;
            overflow: hidden;
        }
    }

    .send_out {
        width: 122px;
        height: 40px;
        text-align: center;
        background: #1272fb;
        border-radius: 8px;
        font-size: 22px;
        color: #ffffff;
        padding: 0 38px;
        line-height: 38px;
        margin-left: 10px;
        box-sizing: border-box;
        position: absolute;
        right: 42px;
        bottom: 34px;
    }
}

js

 /** 适配输入框与软键盘的距离 */
    bottomHeight: number = 1;

    /**
     * 评论图标
     */
    handlerReply() {
        this.isShowInput = true;
    }

    /** 输入框失焦事件 */
    handlerBlur() {
        this.isShowInput = false;
        this.bottomHeight = 0;
    }

    /** 输入框聚焦事件 */
    handlerFocus(e) {
        console.log(e);
        this.bottomHeight = e.detail.height;
    }

    /** 发布评论按钮 */
    async sendTextMsg() {
        try {
            if (this.replyContent.length === 0) {
                return Tips.toast("回复内容不能为空！");
            }
            Tips.showLoading();
            const res = await HospitalService.evaluateReplyInsert({
                centerId: this.comment.id,
                bizCode: this.comment.bizCode,
                content: this.replyContent,
            });
            this.replyContent = "";
            this.comment.evaluationCenterReplyDTOS = [...this.comment.evaluationCenterReplyDTOS, res];
        } catch (e) {
            Ehr.handleError(e);
        } finally {
            Tips.hideLoading();
        }
    }