mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-26 18:00:43 +01:00
feat(Textarea): add maxrows prop to restrict autoresize (#1302)
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
@@ -119,6 +119,18 @@ props:
|
|||||||
---
|
---
|
||||||
::
|
::
|
||||||
|
|
||||||
|
Use the `maxrows` prop to set a maximum number of rows when autoresizing. If set to `0`, the Textarea will infinitely grow up.
|
||||||
|
::component-card
|
||||||
|
---
|
||||||
|
baseProps:
|
||||||
|
placeholder: 'Search...'
|
||||||
|
modelValue: 'Here is an autoresize Textarea, write new lines to make the Textarea grow up at a maximum of 5 rows...'
|
||||||
|
props:
|
||||||
|
autoresize: true
|
||||||
|
maxrows: 5
|
||||||
|
---
|
||||||
|
::
|
||||||
|
|
||||||
### Resize
|
### Resize
|
||||||
|
|
||||||
Use the `resize` prop to enable the resize control.
|
Use the `resize` prop to enable the resize control.
|
||||||
|
|||||||
@@ -66,6 +66,10 @@ export default defineComponent({
|
|||||||
type: Number,
|
type: Number,
|
||||||
default: 3
|
default: 3
|
||||||
},
|
},
|
||||||
|
maxrows: {
|
||||||
|
type: Number,
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
autoresize: {
|
autoresize: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
@@ -160,7 +164,7 @@ export default defineComponent({
|
|||||||
const newRows = (scrollHeight - padding) / lineHeight
|
const newRows = (scrollHeight - padding) / lineHeight
|
||||||
|
|
||||||
if (newRows > props.rows) {
|
if (newRows > props.rows) {
|
||||||
textarea.value.rows = newRows
|
textarea.value.rows = props.maxrows ? Math.min(newRows, props.maxrows) : newRows
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user