elementUI textarea可自适应文本高度的文本域
Element UI 的 el-input
组件有一个 type
属性,可以设置为 textarea
以创建一个文本区域(textarea)。要使这个文本区域可以自适应内容的高度,可以设置 autosize
属性。
以下是一个简单的例子,展示了如何使用 Element UI 的 el-input
组件创建一个可以自适应内容高度的文本域:
<template>
<el-input
type="textarea"
v-model="text"
autosize={{ minRows: 2, maxRows: 4 }}
placeholder="请输入内容"
></el-input>
</template>
<script>
export default {
data() {
return {
text: ''
};
}
};
</script>
在这个例子中,autosize
设置为一个对象 { minRows: 2, maxRows: 4 }
,表示文本域至少有2行高度,最多有4行高度,随着内容的增多,会自动增加高度,而不是滚动查看更多内容。如果你不想限制最大行数,可以只设置 minRows
。如果不想限制最小行数,可以只设置 maxRows
。
评论已关闭