在 vue 中使用 vue-typed-js 实现打字机效果

1、实现打字机效果：

一个字一个字出现，再一个字一个字消失，如此循环。

2、安装 vue-typed-js

npm install --save vue-typed-js

3、使用

import Vue from 'vue'
import VueTypedJs from 'vue-typed-js'
 
Vue.use(VueTypedJs)

首先是<template></template>标签里的代码，代码如下所示：

其中，loop为true是为循环执行；strings是想要展示打印机效果的文字；typeSpeed是以毫秒为单位输入速度；backSpeed是以毫秒为单位的退格速度；startDelay是以毫秒为单位的输入前的时间

<vue-typed-js
  class="desc"
  :strings="typingTexts"
  :loop="true"
  :startDelay="300"
  :typeSpeed="100"
  :backSpeed="50"
>
  <span class="typing"></span>
</vue-typed-js>
 
<script>
data() {
  return {
    typingTexts: [
      "hello",
      "world",
    ],
  };
},
</script>

github

https://github.com/Orlandster/vue-typed-js#exampleshttps://github.com/Orlandster/vue-typed-js#examples