您当前的位置：首页 > 网站建设 > javascript
\| php \| asp \| css \| H5 \| javascript \| Mysql \| Dreamweaver \| Delphi \| 网站维护 \| 帝国cms \| React \| 考试系统 \| ajax \| jQuery \| 小程序 \|

Vue中textarea自适应高度方案的实现

51自学网 2022-02-21 13:34:41

隐藏的问题

抛开原生JS，框架的大部分UI库都支持自适应textarea高度功能，但普遍都忽略了一个功能，就是自适应高度的回显。

使用这些库的时候，我们很容易的在textarea中键入内容，超出范围时会自动延展一行，保证内容高度的自适应。当我们提交内容，在其它页面使用同样的UI来渲染时，麻烦的就来了，有些UI库是不支持自适应回显的，这就需要我们通过行高、行数甚至高度之间的计算得出一个基值，从而实现回显。

常见得方案有两种，一种是在页面地“边远地区”添加一个ghost dom来模拟输入换行，这个dom的可能是editable属性为true的div或者是一个一摸一样得textarea。
以element-ui的input组件举例，当我们在组件内输入值时，会调用resizeTextarea方法

resizeTextarea() {
下载地址:
使用vue-video-player实现直播的方式
vue项目中的支付功能实现(微信支付和支付宝支付)