在前端开发中，经常需要将文本框或文本域等输入框自动扩展，以适应用户的输入内容。这时候，我们可以使用 ui-autogrow 这个 npm 包，它提供了一个简单的解决方案。
安装
在使用 ui-autogrow 之前，需要先安装它。可以使用 npm 进行安装：
npm install ui-autogrow --save
安装完成后，就可以在项目中引入它了。
引入
可以使用以下方式在项目中引入 ui-autogrow：
import 'ui-autogrow';
使用
ui-autogrow 提供了 jQuery 插件形式的调用方式。
HTML
在 HTML 中，我们需要将需要自动扩展的输入框添加一个类名（比如 autogrow），以及一个 data-min-rows 属性来设置输入框的最小行数：
<textarea class="autogrow" data-min-rows="3"></textarea>
JavaScript
在 JavaScript 中，我们使用 jQuery 选择器来选择需要自动扩展的输入框，并调用 ui-autogrow 方法即可：
$('.autogrow').autoGrow();ui-autogrow 会自动根据输入框的内容，动态地调整输入框的高度，以适应用户的输入。
部分更新
有时候，我们需要在输入框的内容变化后，手动调用 ui-autogrow 来更新输入框的高度。可以使用以下方式：
$('.autogrow').trigger('autogrow');这样，输入框的高度就会根据内容的变化而自动扩展了。
示例代码
下面是一个完整的示例代码，演示了如何使用 ui-autogrow：
HTML
-- -------------------- ---- ------- --------- ----- ------ ------ ------------------- ---------- ------ ---------------- ------ ---------------- ----------------- ------- ------ ---------- ---------------- ----------------------------- -------- ---------------------------------------------------------------------------- -------- ------------------------------ -------- ------------------------- ------- -------
CSS
-- -------------------- ---- ------- --------- - --------- ------ ------- ----- --------- ----- ----------- ----- ------------- ---- -------- --- ----- ----- --------------- ---- -------- ----- -
JavaScript
// 引入 ui-autogrow
import 'ui-autogrow';
// 选择需要自动扩展的输入框，并调用 ui-autogrow 方法
$('.autogrow').autoGrow();指导意义
ui-autogrow 是一个非常实用的 npm 包，可以方便地实现输入框的自动扩展。掌握了它的使用方法后，我们可以节省大量手动调整输入框高度的时间，提高前端开发的效率。
除了 ui-autogrow，还有许多类似的 npm 包和插件可以实现输入框的自动扩展。学习和掌握这些工具，可以使我们在开发过程中事半功倍，提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005516681e8991b448ce9bf