请选择 进入手机版 | 继续访问电脑版
帖子
帖子
用户
博客
课程
显示全部楼层
85
帖子
6
勋章
5705
Y币

[BUG] 关于键盘收起时,撑起的高度还存在的bug

[复制链接]
发表于 2022-3-29 17:34:50
本帖最后由 Not Foundcl 于 2022-3-29 17:36 编辑

input  键盘撑起的高度在输入值后,收起键盘,撑起的高度不是应该也没了吗,居然还存在,算是bug吗,如下图白色那块是键盘撑起的高度。测试手机:荣耀9 存在这个问题,华为P30没有。测试代码:
  1. <template>
  2.         <view class="personal">
  3.                 <scroll-view class="main" scroll-y style={'height:'+height+'px'} show-scrollbar="false">
  4.                         <view class="rowbox" >
  5.                                 <text class="listName">姓名{height}</text>
  6.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  7.                         </view>
  8.                         <view class="rowbox" >
  9.                                 <text class="listName">姓名{height}</text>
  10.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  11.                         </view>
  12.                         <view class="rowbox" >
  13.                                 <text class="listName">姓名{height}</text>
  14.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  15.                         </view>

  16.                         <view class="rowbox" >
  17.                                 <text class="listName">姓名{height}</text>
  18.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  19.                         </view>
  20.                         <view class="rowbox" >
  21.                                 <text class="listName">姓名{height}</text>
  22.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  23.                         </view>
  24.                         <view class="rowbox" >
  25.                                 <text class="listName">姓名{height}</text>
  26.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  27.                         </view>
  28.                         <view class="rowbox" >
  29.                                 <text class="listName">姓名{height}</text>
  30.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  31.                         </view>
  32.                         <view class="rowbox" >
  33.                                 <text class="listName">姓名{height}</text>
  34.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  35.                         </view>
  36.                         <view class="rowbox" >
  37.                                 <text class="listName">姓名{height}</text>
  38.                                 <input type="text" v-model="name" placeholder="请输入姓名" />
  39.                         </view>
  40.                 </scroll-view>
  41.                 <button class="btn">提交</button>
  42.         </view>
  43. </template>
  44. <script>
  45. export default {
  46.         name: 'personal',
  47.         apiready() {

  48.         },
  49.         data() {
  50.                 return {
  51.                         name: '',
  52.                 }
  53.         },
  54.         computed: {
  55.                 height() {
  56.                         return api.winHeight
  57.                 },
  58.         },
  59.         methods: {


  60.         }
  61. }
  62. </script>
  63. <style scoped>
  64. .personal {
  65.         position: absolute;
  66.         top: 0;
  67.         left: 0;
  68.         bottom: 0;
  69.         right: 0;
  70.         width: 100%;
  71.         height: 100%;
  72.         background: #fff;
  73. }
  74. .main {
  75.         padding: 0 20px 80px 20px;
  76.         background-color: black;
  77. }
  78. .rowbox {
  79.         margin-bottom: 20px;
  80. }
  81. .listName {
  82.         font-size: 14px;
  83.         font-weight: bold;
  84.         line-height: 20px;
  85.         color: #fff;
  86. }

  87. input {
  88.         width: 100%;
  89.         border: none;
  90.         border-bottom: 1px solid #b1a9a8;
  91. }
  92. input::placeholder {
  93.         font-size: 12px;
  94.         font-weight: 400;
  95.         line-height: 33px;
  96.         color: #b1a9a8;
  97. }

  98. .btn {
  99.         position: absolute;
  100.         bottom: 20px;
  101.         left: 5%;
  102.         height: 44px;
  103.         width: 90%;
  104.         background-color: #ffc053;
  105.         color: #fff;
  106.         font-size: 18px;
  107.         text-align: center;
  108.         border-radius: 18px;
  109.         background-image: linear-gradient(to right, #ffb940, #fb834e);
  110. }
  111. </style>
复制代码



QQ图片20220329172713.jpg
QQ图片20220329172719.jpg
我们这边确认一下
用最新的引擎编译一下,看看荣耀9还有这个问题没,有的话我反馈一下,我这边没荣耀9手机,用鸿蒙测试的没问题,如果还存在,就是bug
您需要登录后才可以回帖 登录

本版积分规则