简介

dazi.js 顾名思义一个实现打字效果的包，包提供三种导入方式全局导入、ES6 的 import 和 CommonJS 的 require。

文件说明

在 lib 目录下有6个文件分别对应着全局、ES6 和 CommonJS 导入方式的文件

其中文件名带有

• global：代表全局导入，直接在 window 对象的 _dazi 属性中，可直接通过script标签导入
• es：代表遵循了 ES6 的暴露方式，可通过 import 导入
• cjs：代表遵循了 CommonJS 的暴露方式，可通过 require导入

ES6 和 CommonJS 的暴露方式均为默认暴露

文件名带有 min 就代表经过了压缩，代码的体积会更小

默认导入的是 es.min.js

使用

import dazi from 'dazi';

const dom = document.getElementById('text');

// 第一个参数为要执行打字的效果的dom
// 第二个参数为配置的项
new dazi(dom, {
    text:[
        'hello JavaScript!',
        'hello world!'
    ]
})

配置项：

| 参数 | 说明 | 类型 | 可选值 | 默认值 | | ----------------- | ------------------------------------------------------------ | ------------- | ----------------- | ------ | | text | 要展示的文字 | string/array | - | - | | showCursor | 是否展示光标 | boolean | - | true | | cursorFlickerTime | 光标闪烁周期时间 | number | - | 1000 | | backtrack | 是否回溯 | boolean | - | true | | speed | 打字速度 | number | - | 100 | | pauseTime | 停顿时间 | number | - | 3000 | | deleteSpeed | 文字删除速度 | number | - | 30 | | mode | 输出模式（循环/随机/单次） | string | cycle/random/once | cycle | | once_backtrack | 在单次输出模式下，最后一次输出是否回溯 | boolean | - | true | | once_showCursor | 在单次输出模式下，最后一次输出完后光标是否展示 | boolean | - | true | | random_first | 在随机输出模式下，第一次输出的内容(数字表示 text 配置项为数组的情况下的索引) | string/number | - | - |

注意：mode 为 random 时，需要 text 为数组且长度大于2

提示：

此包刚写出来，没有在各个浏览器和各个版本的浏览测试过，请谨慎使用。

开发趣事

1. 刚开始本来想叫 typing.js 的，结果我去 npm 一搜有已经有了，去看了他个那个演示页面，他那个怎么说呢，属实nb！，真的，后来一想这要是一搜我这个和他的同时出来，一对比还是有点那啥，所以我果断改名。
2. 我想应该会有人想为什么我会还弄个使用 CommonJS 暴露的文件，这个呢是因为我写了一个自动化打包的文件，本来没想加上的，后来一想，万一以后用得到呢，到时候要用了，copy 一下就好了，还得加上，反正多个循环的事吗