Resizable for entering multiple lines of text information.
Resizable for entering multiple lines of text information. Add attribute `type="textarea"` to change `input` into native `textarea`.
::: demo Add attribute `type="textarea"` to change `input` into native `textarea`.
::: demo Control the height by setting the `rows` prop.
```html
<el-input
type="textarea"
:autosize="{ minRows: 2, maxRows: 4}"
:rows="2"
placeholder="Please input"
v-model="textarea">
</el-input>
...
...
@@ -242,6 +244,40 @@ export default {
```
:::
### Autosize Textarea
Setting the `autosize` prop for a textarea type of Input makes the height to automatically adjust based on the content. An options object can be provided to `autosize` to specify the minimum and maximum number of lines the textarea can automatically adjust.
::: demo
```html
<el-input
type="textarea"
autosize
placeholder="Please input"
v-model="textarea2">
</el-input>
<divstyle="margin: 20px 0;"></div>
<el-input
type="textarea"
:autosize="{ minRows: 2, maxRows: 4}"
placeholder="Please input"
v-model="textarea3">
</el-input>
<script>
exportdefault{
data(){
return{
textarea2:'',
textarea3:''
}
}
}
</script>
```
:::
### Mixed input
Prepend or append an element, generally a label or a button.