import TypeIt from 'typeit'
import { defineComponent, h } from 'vue'
export default defineComponent({
name: 'TypeIt',
props: {
/** 打字速度,以每一步之间的毫秒数为单位 */
speed: {
type: Number,
default: 200,
},
values: {
type: Array,
defalut: [],
},
className: {
type: String,
default: 'type-it',
},
cursor: { // 是否需要光标
type: Boolean,
default: true,
},
index: {
type: Number
},
},
render() {
return h(
'span',
{
class: this.className,
},
{
default: () => [],
},
)
},
mounted() {
new (TypeIt as any)(`.${this.className}`, {
strings: this.values,
speed: this.speed,
cursor: this.cursor,
}).go()
setTimeout(() => {
this.$emit('render-complete', this.index);
}, this.speed * (this.values || []).join('').length + 1000);
},
})
typeIt 文字动态输入 和 hender 函数
于 2023-06-05 17:47:45 首次发布