View Shadcn UI 是一个基于 Tailwind CSS 构建的组件库。推荐一套为 Java 开发人员提供方便易用的 SDK 来与目前提供服务的的 Open AI 进行交互组件： https://github.com/devlive-community/openai-java-sdk 推荐一套功能强大的开源数据中台系统： https://github.com/devlive-community/datacap 组件源码地址： https://github.com/devlive-community/view-shadcn-ui 核心功能添加组件文档生成脚本添加发布 CI 流程二维码新功能：支持内边距和圆角新功能：支持外边距新功能：支持图片插槽工作流修复：修复数据不返回的问题日志新功能：支持自定义模式数字输入修复：修复最大值和最小值超出边界的问题时间选择器新功能：支持格式化器和解析器新功能：支持禁用和可清除新功能：支持快速选择时间新功能：支持格式化颜色选择器支持禁用和只读模式支持预设颜色支持透明度支持 HSL 颜色模式支持显示面板、显示吸管、显示透明度、显示格式日期选择器新功能：支持禁用和只读模式新功能：支持格式化新功能：支持可清除新功能：支持显示快捷方式新功能：支持上一年和下一年新功能：支持高亮显示今天新功能：支持范围选择 Cron 表达式新功能：支持 Cron 表达式全局引用修改 main.ts 入口文件中的配置如下: import { createApp } from 'vue' import App from './App.vue' const app = createApp(App) // Import View Shadcn UI import ViewShadcnUI from 'view-shadcn-ui' app.use(ViewShadcnUI) if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 按需引用 import { ShadcnButton } from 'view-shadcn-ui' app.component('ShadcnButton', ShadcnButton) if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 或者 <template> <ShadcnButton>Button</ShadcnButton> </template> <script setup> import { ShadcnButton } from 'view-shadcn-ui' </script> if(window.hljsLoader && !document.currentScript.parentNode.hasAttribute('data-s9e-livepreview-onupdate')) { window.hljsLoader.highlightBlocks(document.currentScript.parentNode); } 推荐一套全平台数据库管理工具，建议下载使用: https://github.com/devlive-community/dbm 我们即将推出一套开源新系统。InfoSphere 是一款面向企业和个人的开源 Wiki 系统，旨在提供简单而强大的知识管理解决方案。建议尝试使用: https://github.com/devlive-community/incubator-infosphere 欢迎大家前往测试站点使用并提出宝贵的建议，如果您有需要实现的布局，可以提交 issues 我们会在最快的时间内实现。我们的示例地址为： https://view-shadcn-ui.devlive.org

Vue3 组件 view-shadcn-ui 2024.5.3 发布

qianmoQ

View Shadcn UI 是一个基于 Tailwind CSS 构建的组件库。

推荐一套为 Java 开发人员提供方便易用的 SDK 来与目前提供服务的的 Open AI 进行交互组件：https://github.com/devlive-community/openai-java-sdk

推荐一套功能强大的开源数据中台系统：https://github.com/devlive-community/datacap

组件源码地址：https://github.com/devlive-community/view-shadcn-ui

核心功能

添加组件文档生成脚本
添加发布 CI 流程

二维码

新功能：支持内边距和圆角
新功能：支持外边距
新功能：支持图片插槽

工作流

修复：修复数据不返回的问题

日志

新功能：支持自定义模式

数字输入

修复：修复最大值和最小值超出边界的问题

时间选择器

新功能：支持格式化器和解析器
新功能：支持禁用和可清除
新功能：支持快速选择时间
新功能：支持格式化

颜色选择器

支持禁用和只读模式
支持预设颜色
支持透明度
支持 HSL 颜色模式
支持显示面板、显示吸管、显示透明度、显示格式

日期选择器

新功能：支持禁用和只读模式
新功能：支持格式化
新功能：支持可清除
新功能：支持显示快捷方式
新功能：支持上一年和下一年
新功能：支持高亮显示今天
新功能：支持范围选择

Cron 表达式

新功能：支持 Cron 表达式

全局引用

修改 main.ts 入口文件中的配置如下:

import { createApp } from 'vue'
import App from './App.vue'
const app = createApp(App)

// Import View Shadcn UI
import ViewShadcnUI from 'view-shadcn-ui'
app.use(ViewShadcnUI)

按需引用

import { ShadcnButton } from 'view-shadcn-ui'
app.component('ShadcnButton', ShadcnButton)

或者

<template>
    <ShadcnButton>Button</ShadcnButton>
</template>

<script setup>
    import { ShadcnButton } from 'view-shadcn-ui'
</script>

推荐一套全平台数据库管理工具，建议下载使用: https://github.com/devlive-community/dbm

我们即将推出一套开源新系统。InfoSphere 是一款面向企业和个人的开源 Wiki 系统，旨在提供简单而强大的知识管理解决方案。建议尝试使用: https://github.com/devlive-community/incubator-infosphere

欢迎大家前往测试站点使用并提出宝贵的建议，如果您有需要实现的布局，可以提交 issues 我们会在最快的时间内实现。

我们的示例地址为：https://view-shadcn-ui.devlive.org