微信小程序输入框聚焦拉起键盘导致placeholder上移问题

WechatIMG1106

原因:原代码没有用scroll-view,而是在根元素样式上加overflow: auto
<template>
  <view class="scan-list-container">
   <!--滚动代码-->
  </view>
</template>
<style lang="scss" scoped>
.scan-list-container {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #f7f7f7;
  overflow: auto;
}
</style>
解决方法:把根元素的滚动条样式去掉,然后在根元素下加一层scroll-view(必须设置高度且小于100%)
<template>
  <view class="scan-list-container">
      <scroll-view style="height:99.9vh;width:100%;box-sizing:border-box;padding:0;" scroll-y="true">
           <!--滚动代码-->
      </scroll-view>
  </view>
</template>
<style lang="scss" scoped>
.scan-list-container {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #f7f7f7;
}
</style>

 

posted @ 2025-08-07 17:17  园友3035760  阅读(19)  评论(0)    收藏  举报