block-time-picker

基于 vue3 封装的块状时间选择器 block-time-picker

预览地址 | 预览地址2

📦 安装

npm install block-time-picker
# or
yarn add block-time-picker
# or
pnpm add block-time-picker

📡 CDN

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/block-time-picker/dist/style.css" />
<script src="//cdn.jsdelivr.net/npm/block-time-picker"></script>
<!-- or -->
<link rel="stylesheet" href="//unpkg.com/block-time-picker/dist/style.css" />
<script src="//unpkg.com/block-time-picker"></script>

⚙️ 用法

局部注册（单文件）

import "block-time-picker/dist/style.css";
import { WebTimePicker, MobieTimePicker } from "block-time-picker";
// web端使用
<web-time-picker v-model="timeRange"></web-time-picker>
// mobie端使用
<mobie-time-picker v-model="timeRange"></mobie-time-picker>

全局注册（main.js）

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

import 'block-time-picker/dist/style.css'
import BlockTimePicker from 'block-time-picker'

const app = createApp(App)

app.use(BlockTimePicker).mount('#app')

点击查看按需、全局以及Html文件引入的用法示例

许可证

MIT © 2025-present, wxx0822