el-input使用textarea后回显出现空白但是一输入内容就恢复正常
时间: 2024-05-02 14:18:14 浏览: 317
这种情况可能是因为 el-input 组件的默认高度太小,导致在使用 textarea 后无法正确显示输入的内容。
你可以尝试在 el-input 组件上设置 min-height 或者 height 样式来增加它的高度,以便正确显示输入的内容。
另外,如果你使用了 v-model 来绑定 el-input 的值,可以在绑定的变量上设置 trim 选项来自动去除输入内容前后的空格,以避免出现空白的情况。
例如:
```
<el-input v-model.trim="inputValue" type="textarea" :rows="3" :autosize="{minRows: 3, maxRows: 5}"></el-input>
```
其中,v-model.trim="inputValue" 表示将输入的值绑定到 inputValue 变量上,并自动去除前后空格。
相关问题
el-input textarea回显出现空白,撑高了盒子
这个问题可能是因为文本框中的内容包含了换行符,导致文本框的高度增加,而盒子的高度没有随之调整。
解决方法可以尝试设置文本框的高度为auto,这样文本框的高度会根据内容自适应。也可以使用CSS属性overflow:auto来允许文本框出现滚动条,以便容纳更多的内容。
另外,如果使用的是el-form组件,可以考虑将textarea组件包裹在el-form-item中,这样可以自动处理表单项的布局和样式。
thymeleaf html 中 <textarea 回显后端传过来的值 <input type="input" placeholder="请选择时间" onClick="WdatePicker({dateFmt:'yyyy-MM-dd', minDate:'%y-%M-%d', readOnly:true})" class="form-control radius3" id="closeTime" name="closeTime"/> input这个也回显后端显示的值。
可以使用Thymeleaf的属性绑定语法`${}`来实现HTML元素中的值的回显。对于`<textarea>`元素,可以通过绑定`th:text`属性来实现回显,例如:
```
<textarea th:text="${backendValue}"></textarea>
```
对于`<input>`元素,可以通过绑定`th:value`属性来实现回显,例如:
```
<input type="text" th:value="${backendValue}" />
```
在这个例子中,`${backendValue}`是从后端传递到前端的值。当Thymeleaf渲染页面时,它会将`${backendValue}`替换为实际的值。这样就可以在页面上显示从后端传递过来的值。
阅读全文