在前端开发中，我们经常需要实现自动打字效果的功能。使用 JavaScript 实现这个功能需要花费一定的时间和精力。但好在有 @ianhatton/vanilla-autotyper 这个 npm 包可以帮助我们快速实现这个功能。本文将简单介绍如何使用这个 npm 包。
安装
@ianhatton/vanilla-autotyper 这个 npm 包可以通过 npm 命令行工具进行安装，在终端执行以下命令即可：
npm i @ianhatton/vanilla-autotyper
使用
使用 @ianhatton/vanilla-autotyper 可以非常方便地实现自动打字效果，只需要几行代码即可实现。在你的 JavaScript 代码中引入这个库：
import Autotyper from '@ianhatton/vanilla-autotyper';
接着，创建一个新的 Autotyper 实例：
const autotyper = new Autotyper({
selector: '.autotyper',
words: ['Hello,', 'World!'],
delay: 500,
pause: 1000,
});其中，selector 是你想要实现自动打字效果的元素的 CSS 选择器，words 是你想要自动打印的一组单词或短语，delay 是每个字符打印的间隔时间，pause 是每个单词打印完成后停止的时间。当你想要开始自动打字时，只需要调用 Autotyper 实例的 start 方法即可：
autotyper.start();
示例代码
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
---------------- ------------
-------
------
------------- ---------
-- ----------------------
------- --------------
------ --------- ---- -------------------------------
----- --------- - --- -----------
--------- -------------
------ ---------- ----------
------ ----
------ -----
---
------------------
---------
-------
-------总结
借助 @ianhatton/vanilla-autotyper 这个库，实现自动打字效果的功能变得非常简单了。无需担心在实现细节上花费过多的时间和精力，只需几行代码即可完成。如果你有自动打字效果相关的需求，不妨试试这个库。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066bc1967216659e2441de