uniapp解决聊天界面IOS系统的界面上顶

输入框需要设置:adjustPosition="false"来防止界面被顶起

<view :style="{
  width: '100%',
  position: 'fixed',
  bottom: keyHeight + 'px',
  paddingBottom: keyHeight != 8 ? '16rpx' : 'constant(safe-area-inset-bottom)',
  paddingBottom: keyHeight != 8 ? '16rpx' : 'env(safe-area-inset-bottom)',
  }">
    <uv-input placeholder="请输入" :adjustPosition="false" :customStyle="{
      width: '100%',
      height: '64rpx',
      border: '0px'
      }" shape="circle" border="surround" v-model="message" @input="ChangeInput" @blur="onBlur"
      @keyboardheightchange="keyboardheightchange">
    </uv-input>
  <text @click="SendMessage">发送</text>
</view>

键盘高度发生变化的时候触发@keyboardheightchange事件，该事件会返回一个键盘高度，我们给view容器设置该键盘的bottom距离，然后再判断键盘是否弹起，弹起后给容器追加设置安全距离来适配苹果机型。

export default {
        data() {
            return {
                keyHeight: 8,
            }
        },
  methods: {
      onBlur() {
                  uni.offKeyboardHeightChange();
            },
            keyboardheightchange(e) {
                this.keyHeight = e.detail.height == 0 ? 8 : e.detail.height
            },
  }
}

---

参考文档：
offKeyboardHeightChange
keyboardheightchange