Vue3 组件 view-shadcn-ui 2024.4.0 发布

embedded/2024/11/23 21:38:58/

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

🐛 Bug 修复

  • input: 修复文本域边框显示问题 (588b8dd)
  • tree: 修复在懒加载时悬浮和选中状态样式异常的问题 (b6610f1)

✨ 新功能

  • contextmenu: 支持右键菜单功能 (2f1620e)
  • contextmenu: 支持自定义位置 (59a9b1c)
  • contextmenu: 支持菜单项禁用状态 (13f0029)
  • contextmenu: 支持子菜单功能 (5bc2533)
  • select: 支持选项懒加载 (4bb4761)
  • spin: 优化背景层显示
  • tabs: 支持标签项的标签插槽 (41d4279)
  • tabs: 支持标签项的点击事件 (d191501)
  • collapse: 支持折叠面板项的标题功能 (0f0e99d)
  • form: 支持动态表单 (bfd3997)
  • hover card: 修复代码问题 (d22408c)
  • hover card: 支持悬浮卡片功能 (712549a)
  • hover card: 支持标题和底部插槽 (66f5b35)
  • toggle: 添加图片示例 (65703a8)
  • toggle: 支持禁用状态 (b151771)
  • toggle: 支持分组功能 (5b7bda1)
  • toggle: 支持分组多选模式 (ae09b8c)
  • toggle: 支持尺寸设置 (0efec03)
  • toggle: 支持切换功能 (f732b08)
  • switch: 支持自定义值设置 (036b7b3)

全局引用

修改 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://shadcn.vue.devlive.org


http://www.ppmy.cn/embedded/139248.html

相关文章

k8s 中传递参数给docker容器

文章目录 docker启动时传递参数使用k8s env传递完全覆盖 ENTRYPOINT 和 CMD 在 Kubernetes 中&#xff0c;可以通过多种方式将参数传递给 Dockerfile 或其运行的容器&#xff0c;常见的方式包括使用环境变量、命令行参数、配置文件等。以下是一些常用的方法&#xff1a; docker…

国产三维CAD 2025新动向:推进MBD模式,联通企业设计-制造数据

本文为CAD芯智库原创整理&#xff0c;未经允许请勿复制、转载&#xff01; 上一篇文章阿芯分享了影响企业数字化转型的「MBD」是什么、对企业优化产品设计流程有何价值——这也是国产三维CAD软件中望3D 2024发布会上&#xff0c;胡其登先生&#xff08;中望软件产品规划与GTM中…

大三学生实习面试经历(1)

最近听了一位学长的建议&#xff0c;不能等一切都准备好再去开始&#xff0c;于是就开始了简历投递&#xff0c;恰好简历过了某小厂的初筛&#xff0c;开启了线上面试&#xff0c;记录了一些问题&#xff1a; &#xff08;通过面试也确实了解到了自己在某些方面确实做的还不够…

【Redis】Redis实现的消息队列

一、用list实现【这是数据类型所以支持持久化】 消息基于redis存储不会因为受jvm内存上限的限制&#xff0c;支持消息的有序性&#xff0c;基于redis的持久化机制&#xff0c;只支持单一消费者订阅&#xff0c;无法避免消息丢失。 二、用PubSub【这不是数据类型&#xff0c;是…

Spring、SpringMVC、SpringBoot、Mybatis小结

Spring Spring是一个轻量级的控制反转&#xff08;IoC&#xff09;和面向切面&#xff08;AOP&#xff09;的容器&#xff08;框架&#xff09; Spring框架的核心特性包括依赖注入&#xff08;Dependency Injection &#xff0c;DI&#xff09;、面向切面编程&#xff08;Aspe…

LeetCode297.二叉树的序列化和反序列化

题目要求 序列化是将一个数据结构或者对象转换为连续的比特位的操作&#xff0c;进而可以将转换后的数据存储在一个文件或者内存中&#xff0c;同时也可以通过网络传输到另一个计算机环境&#xff0c;采取相反方式重构得到原数据。 请设计一个算法来实现二叉树的序列化与反序…

MATLAB常见数学运算函数

MATLAB中含有许多有用的函数,可以随时调用。 a b s abs abs函数 a b s abs abs函数在MATLAB中可以求绝对值,也可以求复数的模长:c e i l ceil ceil函数 向正无穷四舍五入(如果有小数,就向正方向进一)f l o o r floor floor函数 向负无穷四舍五入(如果有小数,就向负方向…

【论文阅读】WaDec: Decompiling WebAssembly Using Large Language Model

论文阅读笔记:WaDec: Decompiling WebAssembly Using Large Language Model 1. 来源出处 论文标题: WaDec: Decompiling WebAssembly Using Large Language Model作者: Xinyu She, Yanjie Zhao, Haoyu Wang会议: 39th IEEE/ACM International Conference on Automated Softwar…