textarea 标签 adjust-position 属性设置为 false 鸿蒙平台不生效 uni-app 设置为 false 仍然上推

textarea 标签 adjust-position 属性设置为 false 鸿蒙平台不生效 uni-app 设置为 false 仍然上推

开发环境 版本号 项目创建方式
Mac 13-inch, M1, 2020 HBuilderX
产品分类:uniapp/App

PC开发环境操作系统:Mac

PC开发环境操作系统版本号:13-inch, M1, 2020

HBuilderX类型:正式

HBuilderX版本号:4.76

手机系统:HarmonyOS NEXT

手机系统版本号:HarmonyOS 5.0.0

手机厂商:华为

手机机型:huawei mate 60 pro

页面类型:vue

vue版本:vue3

打包方式:云端

项目创建方式:HBuilderX

### 示例代码:

```html
<template>  
  <view class="rc-input-container">  
    <view class="rc-input-text">  
      <textarea  
        class="rc-input-text-input"  
        auto-height  
        confirm-hold  
        v-model="text"  
        maxlength="-1"
        @confirm="sendMessage"
        @input="inputHandler"  
        adjust-position="false"
        cursor-spacing="20"
        always-embed  
        show-confirm-bar="false"
        cursor="inputCursor"
        focus="inputFocus"
        @blur="onBlurHandler"
        @focus="onFocusHandler"  
        disable-default-padding="true"
        @keyboardheightchange="onKeyboardHeightChangeHandler"
        confirm-type="send"></textarea>
    </view>
  </view>  
</template>  

<script>
export default {
  data() {
    return {
      text: 'Hello',
      inputCursor: 0,
      inputFocus: false,
    }
  },
  onLoad() {},
  methods: {
    sendMessage() {
      console.info('----sendMessage----===------')
    },
    inputHandler(e) {
      console.info('----inputHandler----===------')
      this.text = e.detail.value;
    },
    onBlurHandler() {
      console.info('----onBlurHandler----===------')
    },
    onFocusHandler() {
      console.info('----onFocusHandler----===------')
    },
    onKeyboardHeightChangeHandler(e) {
      console.info('----onKeyboardHeightChangeHandler----===------', e)
    }
  }
}
</script>

操作步骤:

输入框的焦点,设置 :adjust-position="false" 属性后键盘自动顶起高度

预期结果:

如文档描述设置为 false 不顶起高度

实际结果:

鸿蒙平台设置无效


更多关于textarea 标签 adjust-position 属性设置为 false 鸿蒙平台不生效 uni-app 设置为 false 仍然上推的实战教程也可以访问 https://www.itying.com/category-93-b0.html

23 回复

目前鸿蒙上 adjust-position 会与 show-confirm-bar 冲突,暂时可以通过在鸿蒙平台去掉 show-confirm-bar 来解决

更多关于textarea 标签 adjust-position 属性设置为 false 鸿蒙平台不生效 uni-app 设置为 false 仍然上推的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


我刚才确认了一下这个应该是支持的,你可以测试一下 :adjust-position=“false”

那有支持计划吗?或者有什么其他方式控制吗?

我就是设置了发现不好用,您那边的测试代码可以给我提供下吗?而且这边发现在手动点击收起后就不自动顶起了。但是如果是失去焦点这种在得到焦点还是会自动顶起。并且会多一个安全区的高度

回复 RongCloud:

我现在就是想关闭掉自动弹起,关不掉。而且自动弹起会多一个安全区的高度,这个要怎么处理,是哪个配置影响的吗

你项目的 harmony-configs 下是不是有 oh-packages?

回复 DCloud_UNI_yuhe: 没有的 只有 module.json5 和 string.json 两个文件

回复 RongCloud: 麻烦你把上面的代码运行效果录个视频看看,对比一下加了false和不加false的效果

</template>
<script> export default { data() { return { text: '11', inputCursor: 0, inputFocus: false, } }, onLoad() {
<style lang="scss"> .rc-input-container { z-index: 100; position: fixed; left: 0; right: 0; bottom: 0; box-sizing: border-box; padding: 9px 11px 9px; padding-bottom: calc(env(safe-area-inset-bottom)); padding-bottom: calc(constant(safe-area-inset-bottom)); }

我使用你提供的代码示例 true false 会有区别,但是感觉有 bug 会出现偶现滚动条滑动不到底部的情况。但是代码里面不知道是不是因为用了浮动布局,导致 :adjust-position=“false” 没有效果,

回复 RongCloud: 有试过其它平台吗?效果一致吗?

回复 DCloud_UNI_yuhe: 其他平台没有问题。

<textarea
class=“rc-input-text-input”
auto-height
confirm-hold
v-model=“text”
:maxlength="-1"
@confirm=“sendMessage”
@input=“inputHandler”
:adjust-position=“false”
:cursor-spacing=“20”
always-embed
:show-confirm-bar=“false”
:cursor=“inputCursor”
:focus=“inputFocus”
@blur=“onBlurHandler”
@focus=“onFocusHandler”
:disable-default-padding=“true”
@keyboardheightchange=“onKeyboardHeightChangeHandler”
confirm-type=“send”></textarea> 视频是设置 :adjust-position=“false” 的效果。
我代码里有逻辑控制 :adjust-position=“false” 后,整个输入栏的弹起高度由 @keyboardheightchange 事件返回的高度做适应。
但是看视频里面的设置 false 后并没有效果,我又通过 @keyboardheightchange 事件 弹起了高度。但是当我点击手动收起后,效果正常了。但是只要不点击手动收起就是会得到焦点自动跟随。

hbuilderx 4.81 已修复

这边发现 vivo 手机也会偶现出现失效的问题

回复 RongCloud: 是不能稳定复现吗?

回复 DCloud_UNI_yuhe: 是的目前遇到的事 vivo x90s,iqoo z5 出现后一段时间稳定复现。

在鸿蒙平台上,adjust-position="false" 属性确实可能存在兼容性问题。这是由于鸿蒙系统的键盘弹起机制与iOS/Android存在差异。

从你的代码来看,虽然设置了 adjust-position="false",但鸿蒙系统的键盘弹起默认行为可能仍然会调整页面布局。建议尝试以下解决方案:

  1. 使用 page-meta 页面元信息配置:
<page-meta :adjust-position="false">
  <!-- 页面内容 -->
</page-meta>
  1. 结合CSS固定定位:
.rc-input-container {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
}
  1. 监听键盘高度变化手动调整:
onKeyboardHeightChangeHandler(e) {
  if (e.detail.height === 0) {
    // 键盘收起
  } else {
    // 键盘弹起,手动控制布局
  }
}
回到顶部