1.9.1 • Published 8 months ago

vue-amazing-ui v1.9.1

Weekly downloads
-
License
MIT
Repository
github
Last release
8 months ago

Documentation

Vue Amazing UI

Features

  • The component library is implemented with Vue@3.5.12+ TypeScript@5.6.3 + Vite@5.4.10 + Less@4.2.0.
  • Currently, it includes 63 basic UI components and 16 utility functions, with continuous exploration and updates ongoing...
  • Each component is a Single-File Component (SFC), and they can be used independently without any issues.
  • All component styles use the box-sizing: border-box; model.
  • Ready to use out of the box, no fuss.

Installation

npm install vue-amazing-ui
# or
pnpm add vue-amazing-ui
# or
yarn add vue-amazing-ui
# or
bun add vue-amazing-ui

Use Components

Global

import { createApp } from 'vue'
import App from './App.vue'

import VueAmazingUI from 'vue-amazing-ui'
import 'vue-amazing-ui/css'

const app = createApp(App)
app.use(VueAmazingUI)

Local

<script setup lang="ts">
import { Button } from 'vue-amazing-ui'
import 'vue-amazing-ui/css'
</script>

Use Functions

<script setup lang="ts">
import {
  dateFormat,
  formatNumber,
  rafTimeout,
  cancelRaf,
  throttle,
  debounce,
  add,
  downloadFile,
  toggleDark,
  useEventListener,
  useMutationObserver,
  useScrollDirection,
  useFps,
  useMediaQuery,
  useResizeObserver,
  useSlotsExist
} from 'vue-amazing-ui'
</script>

Project

  • Get the project code
git clone https://github.com/themusecatcher/vue-amazing-ui.git
  • Install dependencies
cd vue-amazing-ui

pnpm i
  • Run project
pnpm dev

Details

My CSDN Blogs

Components

NameDescriptionNameDescription
Alert警告提示Avatar头像
BackTop回到顶部Badge徽标
Breadcrumb面包屑Button按钮
Card卡片Carousel走马灯
Cascader级联选择Checkbox复选框
Collapse折叠面板Countdown倒计时
DatePicker日期选择Descriptions描述列表
Dialog对话框Divider分割线
Drawer抽屉Ellipsis文本省略
Empty空状态Flex弹性布局
FloatButton浮动按钮GradientText渐变文字
Grid栅格Image图片
Input输入框InputNumber数字输入框
InputSearch搜索框List列表
LoadingBar加载条Message全局提示
Modal模态框Notification通知提醒
NumberAnimation数值动画Pagination分页
Popconfirm弹出确认Popover气泡卡片
Progress进度条QRCode二维码
Radio单选框Rate评分
Result结果Scrollbar滚动条
Segmented分段控制器Select选择器
Skeleton骨架屏Slider滑动输入条
Space间距Spin加载中
Statistic统计数值Steps步骤条
Swiper触摸滑动插件Switch开关
Table表格Tabs标签页
Tag标签Textarea文本域
TextScroll文字滚动Timeline时间轴
Tooltip文字提示Upload上传
Video播放器Waterfall瀑布流
Watermark水印

Functions

NameDescriptionType
dateFormat格式化日期时间字符串函数(value: number | string | Date = Date.now(), format: string = 'YYYY-MM-DD HH:mm:ss') => string
formatNumber数字格式化函数(value: number | string, precision: number = 2, separator: string = ',', decimal: string = '.', prefix?: string, suffix?: string) => string
rafTimeout使用 requestAnimationFrame 实现的延迟 setTimeout 或间隔 setInterval 调用函数(fn: Function, delay: number = 0, interval: boolean = false) => object
cancelRaf用于取消 rafTimeout 函数(raf: { id: number }) => void
throttle节流函数(fn: Function, delay: number = 300) => any
debounce防抖函数(fn: Function, delay: number = 300) => any
add消除 js 加减精度问题的加法函数(num1: number, num2: number) => number
downloadFile下载文件并自定义文件名，未传 name 时，从文件地址中自动提取文件名称(url: string, fileName?: string) => void
toggleDark一键切换暗黑模式函数() => void
useEventListener使用 Vue 的生命周期钩子添加和移除事件监听器(target: HTMLElement | Window | Document, event: string, callback: Function) => void
useMutationObserver使用 MutationObserver 观察 DOM 元素的变化(target: Ref | Ref[] | HTMLElement | HTMLElement[], callback: MutationCallback, options = {}) => object
useScrollDirection实时监测页面滚动方向(throttleDelay: number = 100) => object
useFps实时监测浏览器刷新率FPS() => object
useMediaQuery使用媒体查询来判断当前环境是否符合指定的媒体查询条件(mediaQuery: string) => object
useResizeObserver使用 ResizeObserver 观察 DOM 元素尺寸变化(target: Ref | Ref[] | HTMLElement | HTMLElement[], callback: ResizeObserverCallback, options = {}) => object
useSlotsExist监听给定名称或名称数组的插槽是否存在，支持监听单个插槽或一组插槽的存在(slotsName: string | string[] = 'default') => Reactive | Ref\
Vue3TypeScriptViteLessSFCAmazingUIComponentsToolsFunctions
@ant-design/icons-vue@vuepic/vue-datepicker@vueuse/core@vueuse/integrationsant-design-vuecore-jsdate-fnsnaive-uiqrcodeswipervuevue-amazing-uivue-router
@everything-registry/sub-chunk-3072vue-amazing-uivue-amazing-uis1lastdemocmyofficiarepellendusdcj-test1bizarre-uifengmao-ui
1.9.1

8 months ago

1.9.0

8 months ago

1.8.10

8 months ago

1.8.9

8 months ago

1.8.8

8 months ago

1.8.7

8 months ago

1.6.4

9 months ago

1.6.3

10 months ago

1.6.2

10 months ago

1.6.1

10 months ago

1.6.9

9 months ago

1.6.8

9 months ago

1.6.7

9 months ago

1.6.6

9 months ago

1.6.5

9 months ago

1.8.2

8 months ago

1.8.1

8 months ago

1.8.0

8 months ago

1.7.2

8 months ago

1.7.1

9 months ago

1.7.0

9 months ago

1.8.6

8 months ago

1.8.5

8 months ago

1.8.4

8 months ago

1.8.3

8 months ago

1.2.0

11 months ago

1.6.0

10 months ago

0.1.41

1 year ago

0.1.42

1 year ago

0.1.43

1 year ago

0.1.44

1 year ago

0.1.45

1 year ago

1.1.1

11 months ago

1.1.0

11 months ago

1.5.4

10 months ago

1.5.3

10 months ago

1.5.2

10 months ago

1.5.1

10 months ago

1.5.0

10 months ago

1.1.2

11 months ago

1.0.19

12 months ago

1.0.2

1 year ago

1.0.18

12 months ago

1.0.1

1 year ago

1.0.17

12 months ago

1.0.0

1 year ago

1.0.16

12 months ago

1.4.6

10 months ago

1.4.5

10 months ago

1.0.9

12 months ago

1.4.4

10 months ago

1.0.8

12 months ago

1.4.3

11 months ago

1.0.7

1 year ago

1.4.2

11 months ago

1.0.6

1 year ago

1.4.1

11 months ago

1.0.5

1 year ago

1.4.0

11 months ago

1.0.4

1 year ago

1.0.3

1 year ago

1.0.22

11 months ago

1.0.21

12 months ago

1.0.20

12 months ago

1.0.26

11 months ago

1.0.25

11 months ago

1.0.24

11 months ago

1.0.23

11 months ago

1.0.29

11 months ago

1.0.28

11 months ago

1.0.27

11 months ago

1.0.30

11 months ago

1.3.4

11 months ago

1.3.3

11 months ago

1.3.2

11 months ago

1.3.1

11 months ago

1.3.0

11 months ago

1.0.2-beta.1

1 year ago

1.0.234

11 months ago

1.4.7

10 months ago

1.0.11

12 months ago

1.0.10

12 months ago

1.0.15

12 months ago

1.0.14

12 months ago

1.0.13

12 months ago

1.0.12

12 months ago

0.1.40

1 year ago

0.1.39

1 year ago

0.1.38

1 year ago

0.1.37

1 year ago

0.1.36

1 year ago

0.1.35

1 year ago

0.1.34

1 year ago

0.1.33

1 year ago

0.1.32

1 year ago

0.1.31

1 year ago

0.1.30

1 year ago

0.1.29

1 year ago

0.1.28

1 year ago

0.1.27

1 year ago

0.1.25

1 year ago

0.1.26

1 year ago

0.1.20

2 years ago

0.1.21

2 years ago

0.1.22

2 years ago

0.1.23

2 years ago

0.1.24

2 years ago

0.1.18

2 years ago

0.1.19

2 years ago

0.0.40

2 years ago

0.0.41

2 years ago

0.1.10

2 years ago

0.0.42

2 years ago

0.1.11

2 years ago

0.0.43

2 years ago

0.1.12

2 years ago

0.0.44

2 years ago

0.1.13

2 years ago

0.0.45

2 years ago

0.1.14

2 years ago

0.0.46

2 years ago

0.1.15

2 years ago

0.0.47

2 years ago

0.0.37

2 years ago

0.0.38

2 years ago

0.0.39

2 years ago

0.0.30

2 years ago

0.0.31

2 years ago

0.0.32

2 years ago

0.0.33

2 years ago

0.0.34

2 years ago

0.0.35

2 years ago

0.0.36

2 years ago

0.1.0

2 years ago

0.1.2

2 years ago

0.1.1

2 years ago

0.1.8

2 years ago

0.0.26

2 years ago

0.1.7

2 years ago

0.0.27

2 years ago

0.0.28

2 years ago

0.1.9

2 years ago

0.0.29

2 years ago

0.1.4

2 years ago

0.1.3

2 years ago

0.1.6

2 years ago

0.1.5

2 years ago

0.0.50

2 years ago

0.1.16

2 years ago

0.0.48

2 years ago

0.1.17

2 years ago

0.0.49

2 years ago

0.0.25

2 years ago

0.0.24

2 years ago

0.0.23

2 years ago

0.0.22

2 years ago

0.0.21

2 years ago

0.0.20

2 years ago

0.0.19

2 years ago

0.0.18

2 years ago

0.0.17

2 years ago

0.0.16

2 years ago

0.0.15

2 years ago

0.0.14

2 years ago

0.0.13

2 years ago

0.0.12

2 years ago

0.0.10

2 years ago

0.0.9

2 years ago

0.0.8

2 years ago

0.0.7

2 years ago

0.0.6

2 years ago

0.0.5

2 years ago

0.0.4

2 years ago

0.0.3

2 years ago

0.0.1

2 years ago

0.0.0

2 years ago