Vue 3 的 Element-Plus 输入组件

Question

当我使用 Element Plus for Vue 3 创建的输入（文本区域）自动调整大小时，在文本到达正在键入的行的末尾之前会创建一个新行。这使得输入框变得不必要的大，并且文本后面有不必要的空白。

这是该问题的视频演示

这是我的组件代码：

<template>
        <el-input
                :autosize="{ minRows: 1, maxRows: 16 }"
                type='textarea' 
                :input-style="{
                        
                        border: '0px',
                        fontSize: 'large',
                        paddingTop:'15px',
                        paddingBottom:'15px',
                        borderRadius:'0',
                        backgroundColor: 'transparent',
                        minWidth: '100%'                      

                }"
                
            />
 
</template>

<script>


</script>

<style>

</style>

这是文档 https://element-plus.org/en-US/component/input.html

有什么解决办法吗？谢谢。

Answer 1

我认为你需要为你的组件添加一个“row”属性

  <el-input
    v-model="textarea"
    :rows="2" //This will keep your textarea at the same height
    type="textarea"
    placeholder="Please input"
  />