vue中使用vue-typed-js
官网Installationnpm install --save vue-typed-jsDefault importimport Vue from 'vue'import VueTypedJs from 'vue-typed-js'Vue.use(VueTypedJs)Usage<template><div class="box"><header><te
·
Installation
npm install --save vue-typed-js
Default import
import Vue from 'vue'
import VueTypedJs from 'vue-typed-js'
Vue.use(VueTypedJs)
Usage
<template>
<div class="box">
<header>
<template v-if="lineTexts.length > 0">
<vue-typed-js
:strings="lineTexts"
:loop="true"
:startDelay="300"
:typeSpeed="100"
:backSpeed="50"
>
<span class="typing"></span>
</vue-typed-js>
</template>
</header>
</template>
<script>
const jinrishici = require("jinrishici");
export default {
data() {
return {
lineTexts: [],
};
},
beforeMount() {
jinrishici.load(
(result) => {
this.lineTexts = result.data.origin.content;
},
(err) => {
console.error(err);
}
);
},
};
</script>
v-if 是为了防止 lineTexts 值为空也传给 vue-typed-js 组件,哪样的话会报一下错误:
好了,谢谢大家的观看!
更多推荐
已为社区贡献2条内容
所有评论(0)