-
-
Notifications
You must be signed in to change notification settings - Fork 9.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix: (Field)textarea scroll bar is abnormal #12866
base: main
Are you sure you want to change the base?
Conversation
packages/vant/src/field/utils.ts
Outdated
@@ -88,6 +87,8 @@ export function resizeTextarea( | |||
input.style.height = `${height}px`; | |||
// https://github.com/vant-ui/vant/issues/9178 | |||
setRootScrollTop(scrollTop); | |||
} else { | |||
input.style.height = 'auto'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@chenjiahan 确实,没注意到这块,那我能想到的就是记录滚动条位置(上述方案一),每次设置高度后恢复滚动条位置,但写起来不是很优雅,看还有没有其他好方案
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
嗯,目前来看记录滚动条位置可能是一个合适的修复方案
Codecov ReportAttention: Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #12866 +/- ##
==========================================
+ Coverage 89.67% 89.74% +0.06%
==========================================
Files 257 257
Lines 6957 6962 +5
Branches 1711 1714 +3
==========================================
+ Hits 6239 6248 +9
+ Misses 382 377 -5
- Partials 336 337 +1 ☔ View full report in Codecov by Sentry. |
Before submitting a pull request, please read the contributing guide.
在提交 pull request 之前,请阅读 贡献指南。
bugfix
#12859
问题复现:
失去焦点、获取焦点、输入中文都能复现,滚动条会滚动到顶部
原因分析
这里对
input
的height
进行了两次赋值,height=auto
意思是高度撑满父容器,不会出现滚动条,第二次赋值滚动条才会出现,此时滚动条的位置就会被初始化,回到顶部修复方案
方案一
方案二
方案二代码简洁些,选择了方案二
修复后效果: