Play with the vue-typer, a component that simulates a user typing, selecting, and erasing text.
vue-typer
Use this Vue component in your project to simulate a user typing, selecting, and erasing text.
VueTyper is also stylable with CSS!
Example
Install:
npm install --save vue-typer
Usage:
App.vue
//improt locally
import { VueTyper } from 'vue-typer'
export default {
components: {
VueTyper
}
}
<vue-typer text='Vue component that simulates a user typing, selecting, and erasing text!'
:repeat='Infinity'
:shuffle='false'
initial-action='typing'
:erase-delay='550'
erase-style='select-all'
:erase-on-complete='false'
caret-animation='expand'
></vue-typer>
You can bind your props or put them directly on your template. For detailed explanations about props, check here.
This is the result of the above code.
Check it out on GitHub and play around with this interactive Demo.