elementUI textarea可自适应文本高度的文本域

作者：System 时间：2024年08月27日分类：所有,elementui 字数：619

这篇文章距离上次修改已过245天，其中的内容可能已经有所变动。

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。

elementUI textarea可自适应文本高度的文本域

评论已关闭

推荐阅读