uniapp 输入键盘时内容不要顶上去

uniApp 中，当你需要在输入框组件（如 `<input>` 或者 `u-input`）中显示内容并且希望在弹出键盘时不遮挡输入框的内容，你可以通过设置一些样式和配置来实现这一目标。主要有以下几个步骤：

1. **自动调整高度**：在 Vue 的模板中，给输入框添加一个 `@focus` 和 `@blur` 事件处理器，当输入框获取焦点时，动态调整其容器的高度，以便留出足够的空间。

<u-input v-model="inputValue" @focus="adjustHeight(true)" @blur="adjustHeight(false)">
  <slot></slot>
</u-input>

<script>
export default {
  methods: {
    adjustHeight(isFocus) {
      const input = this.$refs.input; // 获取输入框元素
      if (isFocus) {
        input.style.height = 'auto'; // 当聚焦时，恢复自然高度
      } else {
        input.style.height = `${window.innerHeight - 100}px`; // 当失去焦点时，调整高度以避开键盘
      }
    },
  },
}
</script>

2. **设置 CSS**：确保输入框容器有一个合适的最小高度，同时当输入框获得焦点时，可以清除滚动条来避免内容溢出。

.input-container {
  min-height: calc(100% - 50px); /* 避开键盘的高度 */
  overflow-y: hidden;
}

.input-container:focus-within::-webkit-scrollbar { /* WebKit 内核的滚动条处理 */
  display: none;
}

请注意，这个解决方案可能会因设备、浏览器差异以及某些特殊场景（如平板横屏模式）而略有变化。如果你发现输入框在特定条件下仍然有问题，可能需要针对这些情况进行额外检查和调整。