opentiny
/
tiny-vue
2
0
Fork 30
Code Issues Pull Requests 7 Packages Projects Releases Wiki Activity

fix(input):fix textarea height in Multiple line placeholders (#3624) 

* Update App.vue

* fix:多行占位符导致文本域高度计算错误
This commit is contained in:
liukun 2025-07-29 20:44:26 -07:00 committed by GitHub
parent b7aa885dc9
commit db03876549
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
examples/sites/src/App.vue
View File

@ -136,6 +136,7 @@ const handleShowTinyRobot = () => {
padding: 34px 0 0; padding: 34px 0 0;
} }
} }
.right-panel:not(.collapsed) { .right-panel:not(.collapsed) {
:deep(.tr-container) { :deep(.tr-container) {
z-index: 9999; z-index: 9999;

10
packages/renderless/src/input/index.ts
View File

@ -124,7 +124,9 @@ export const calcTextareaHeight =
const { paddingSize, borderSize, boxSizing, contextStyle } = api.calculateNodeStyling(targetElement) const { paddingSize, borderSize, boxSizing, contextStyle } = api.calculateNodeStyling(targetElement)
hiddenTextarea.setAttribute('style', `${contextStyle};${HIDDEN_STYLE}`) hiddenTextarea.setAttribute('style', `${contextStyle};${HIDDEN_STYLE}`)
hiddenTextarea.value = targetElement.value || targetElement.placeholder || '' // 多行placeholder只计算单行高度防止撑高scrollHeight
const safePlaceholder = targetElement.placeholder ? targetElement.placeholder.trim().split('\n')[0] : ''
hiddenTextarea.value = targetElement.value || safePlaceholder || ''
let height = hiddenTextarea.scrollHeight let height = hiddenTextarea.scrollHeight
const textareaStyle: { const textareaStyle: {
@ -161,11 +163,7 @@ export const calcTextareaHeight =
minHeight = props.height minHeight = props.height
} }
if (!state.isDisplayOnly) { if (!state.isDisplayOnly) {
if (props.autosize) { height = Math.max(minHeight, height)
height = Math.max(minHeight, height)
} else {
height = Math.min(minHeight, height)
}
textareaStyle.minHeight = `${Math.floor(minHeight)}px` textareaStyle.minHeight = `${Math.floor(minHeight)}px`
} else { } else {
textareaStyle.minHeight = `0px` textareaStyle.minHeight = `0px`