组件代码
<template>
<span class="number">{{ num }}</span>
</template>
<script>
import '../utils/jquery.leoTextAnimate'
import $ from 'jquery'
export default {
name: "leoTextAnimate",
components: {},
props: {
num: {
type: String,
default() {
return '';
}
}
},
data() {
return {}
},
watch: {},
mounted() {
$('.number').leoTextAnimate({delay: 2000, speed: 3000, autorun: true, fixed: [',', ':', '.'], start: '-'});
},
methods: {}
}
</script>
需要的插件
<script src="//cdn.wanjunshijie.com/cdn/js/jquery.leoTextAnimate.js"></script>
组件需要依赖jq
vue项目使用jquery插件
多数字滚动
vue 多数字滚动效果