基于vue3+ts动态数字滚动效果,并支持数字中的符

vue3-scroll-number

基于 vue3+ts 实现的数字滚动动效,支持日期格式,支持数字格式化中的相关符号,如有遗漏的符号,请在 issues 中告知我

预览

效果预览

安装

npm install vue3-scroll-number

yarn add vue3-scroll-number 全局使用

import { createApp } from 'vue'; import ScrollNumber from 'vue3-scroll-number'; import App from './App.vue'; createApp(App).use(ScrollNumber).mount('#app'); 局部引入

import { ScrollNumber } from 'vue3-scroll-number'; import 'vue3-scroll-number/css' // 引入样式 页面中

<template> <scroll-number :number="10" :h="24" color="#606cee"></scroll-number> </template> 属性

属性 类型 默认值 必填 说明
number Number String - 数字内容
h Number 24 单个数字高度(字体大小默认与高度相同)
color String #606cee 数字颜色
customStyle Object - 额外添加的给数字的样式

版权声明:

1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。
2、网站不提供资料下载,如需下载请到原作者页面进行下载。