V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
userKamtao
V2EX  ›  Vue.js

爆肝两年!打磨了一款 Vue 3 组件库(很新),欢迎体验 👏

  userKamtao ·
lewkamtao · 193 天前 · 14439 次点击
  •   查看本主题需要登录
    这是一个创建于 193 天前的主题,其中的信息可能已经有所发展或是发生改变。

    项目地址

    背景

    依稀记得两年前,在 v2 首发第一个版本,到现在已经两年了,这个组件库仍然在每天维护。

    起初有过几个小伙伴感兴趣来维护,但是发现每个人的写法参差不齐,后面可能会堆叠成一坨千奇百怪的东西,以至于我自己也没办法自主可控。所以这两年主要还是我自己在维护。

    因为很喜欢前端,可以把前端当作爱好,以至于周末和下班后,仍然有热情坐在电脑前打磨各种有趣的东西。

    其实 Lew-UI 和传统的大厂组件库还是有区别的,用法上更灵活,比如:

    优点

    • 内置近 50 个常用组件以及全局指令
    • 用了最新的 Vue 3.5
    • 赏心悦目的暗黑模式
    • 与传统的组件库大有不同、用法更简单
    • 自主研发表单引擎,复杂表单也可以写快快
    • 核心团队不会跑路(很重要)

    缺点

    犹豫个人精力有限,组件库可能仍然无法达到企业级使用的程度。 它有以下的这些问题:

    • 它还没被大规模的广泛应用
    • 它还没经历过千锤百炼的测试
    • 它还没适配各种千奇百怪的浏览器

    但我可以肯定的是,你在 Github 上提的每一个 issues ,我都很很重视,除非能力有限没法解决 : (

    无论是建议还是意见,都非常感谢兄弟们 👏👏👏

    第 1 条附言  ·  193 天前
    谢谢小伙伴们的建议和鼓励,每一条建议都会认真看的,很多建议非常 nice ,虽然任重道远,但有更多的动力去维护了!
    158 条回复    2025-01-01 22:34:18 +08:00
    1  2  
    dbldong
        1
    dbldong  
       193 天前   ❤️ 2
    文档首页这个效果很好诶
    yongyuanfan2
        2
    yongyuanfan2  
       193 天前
    简单体验了一下,还是很不错的,希望下个项目能用上这个组件库,加油!
    NickLuan
        3
    NickLuan  
       193 天前
    首页很炫、但我有强迫症啊
    EmptyDX
        4
    EmptyDX  
       193 天前
    和 antd 很像😂
    Sahzzz
        5
    Sahzzz  
       193 天前
    好看的!
    Laobai
        6
    Laobai  
       193 天前
    很好看,但是公司项目还是用 element-ui 稳妥一点
    houshuu
        7
    houshuu  
       193 天前
    很漂亮!
    concernedz
        8
    concernedz  
       193 天前
    好看,首页很炫酷啊
    4Et5ShxMIq58n6Lr
        9
    4Et5ShxMIq58n6Lr  
       193 天前
    UI 看起来很舒服,不错加油
    abigmiu
        10
    abigmiu  
       193 天前
    flex 这个组件思路好棒
    cxz2998
        11
    cxz2998  
       193 天前
    支持大佬
    ChainLock
        12
    ChainLock  
       193 天前
    首页很炫酷啊,怎么做到的
    yhxx
        13
    yhxx  
       193 天前   ❤️ 1
    发现很早之前就 star 过了
    这个首页很特别,有印象
    zhouyg
        14
    zhouyg  
       193 天前
    首页炫,但也好卡
    wkong
        15
    wkong  
       193 天前
    支持
    Felldeadbird
        16
    Felldeadbird  
       193 天前
    配色不错,我收下了。
    HuberyPang
        17
    HuberyPang  
       193 天前
    Chuckle
        18
    Chuckle  
       193 天前
    很 cool 很特别!
    clencat
        19
    clencat  
       193 天前
    好像没看到主题相关的内容啊,这个定制主题方便么?
    f056917
        20
    f056917  
       193 天前
    厉害,支持一下!
    hanswu
        21
    hanswu  
       193 天前
    支持 很久之前就关注过了🔥
    xuemian
        22
    xuemian  
       193 天前
    首页牛逼
    jy03179163
        23
    jy03179163  
       193 天前
    太厉害了!大佬!!!
    userKamtao
        24
    userKamtao  
    OP
       193 天前
    @clencat 应该是不方便的,哈哈哈哈,还没考虑主题定制这一块。
    body007
        25
    body007  
       193 天前
    牛逼,支持一波。
    kissice
        26
    kissice  
       193 天前
    点进入,原来早就关注过了?再次支持,加油!
    location123
        27
    location123  
       193 天前
    文档首页这个效果强
    kydin
        28
    kydin  
       193 天前 via iPhone
    文档做得好棒! op 的博客也不错呀,是用什么主题呢?
    leonfong
        29
    leonfong  
       193 天前
    支持,已 star
    userKamtao
        30
    userKamtao  
    OP
       193 天前
    @kydin 博客 vscode 那个吗,那个自己写的哈哈哈
    hellodigua
        31
    hellodigua  
       193 天前
    确实好看,赏心悦目,每次看都觉的好看
    abcde123456789
        32
    abcde123456789  
       193 天前
    我就说这个首页很熟悉,打开仓库一看

    [img][/img]
    Freakr
        33
    Freakr  
       193 天前
    文档首页的“关键词标签”,如果点击编辑框后光标在第二行,已有标签的删除功能好像会失效。未点击编辑框和点击编辑框后光标在第一行时,已有标签的删除功能看着正常。
    RoyRao
        34
    RoyRao  
       193 天前
    star 支持一下,顺便问一下 OP 熟悉 React 吗?有机会做 React 版本的嘛?
    dapaoge
        35
    dapaoge  
       193 天前
    赞 👍
    userKamtao
        36
    userKamtao  
    OP
       193 天前
    @Freakr 这个好像真有点问题,应该是失焦的时候输入框跳动导致,没法选中删除按钮的原因,很感谢提出这个 bug ,我周末琢磨琢磨怎么优化!!!
    userKamtao
        37
    userKamtao  
    OP
       193 天前
    @RoyRao React 不太熟,精力很有限,可能暂时精力做 React 的版本了:(
    AchieveHF
        38
    AchieveHF  
       193 天前
    看到表单那里收藏的
    Waverly
        39
    Waverly  
       193 天前
    好看好看!
    AchieveHF
        40
    AchieveHF  
       193 天前
    反馈一个体验上的,点击显示源码,然后收起时候
    shiny
        41
    shiny  
       193 天前
    效果很不错!建议预览页面提供英语,并且开赞助。相信会有很多老外会 donate
    userKamtao
        42
    userKamtao  
    OP
       193 天前   ❤️ 1
    @shiny 会考虑国际化,但其实有点害怕被 donate ,一旦有了赞助,我便开始变得不像我,会有很多声音会左右自己,如果它是完全公益的,那么会比较随心所欲。
    agileago
        43
    agileago  
       193 天前
    感觉没太大新意,没跟得上时代的发展,我觉得新一代的 vue 组件库应该是类似 nextui 那种

    1. 使用 tailwind 作为样式方案
    2. 完全使用 tsx 书写组件
    WickedDogg
        44
    WickedDogg  
       193 天前
    很赞啊,首页的效果太棒了
    dudubaba
        45
    dudubaba  
       193 天前
    强👍
    ersic
        46
    ersic  
       193 天前
    非常棒
    vk4LNh8gE08SBd9V
        47
    vk4LNh8gE08SBd9V  
       193 天前
    @userKamtao #30 这博客好玩 开源了吗
    vk4LNh8gE08SBd9V
        48
    vk4LNh8gE08SBd9V  
       193 天前
    同样 98 年的 差距也太大了
    ixoy
        49
    ixoy  
       193 天前
    不错,坚持难能可贵,是什么让你坚持下来的?
    爱好前端?为啥选择 UI 组件库。
    不是网页游戏,webgl 特效更酷炫更好玩啊。
    userKamtao
        50
    userKamtao  
    OP
       193 天前
    @ixoy 我闲暇之余也会做很多其他有意思的项目,但是每次在做项目的时候,发现其他的组件库 用起来不太顺手,应该可以有更好的体验和用法。所以就这个组件库 也是自己在用,边用边完善。
    userKamtao
        51
    userKamtao  
    OP
       193 天前
    @com781517552 因为后端是 go 写的,其实开源出来只是纯前端的话意义似乎不大,精力有限没时间整理所以没开源。
    qwwuyu
        52
    qwwuyu  
       193 天前
    路过看到 999 个 star 还是点成 1k 算了
    userKamtao
        53
    userKamtao  
    OP
       193 天前
    @qwwuyu 你人怪好咧!!!!!谢谢啦~
    liangdi
        54
    liangdi  
       193 天前
    首页可以看到适用 Angular ?
    userKamtao
        55
    userKamtao  
    OP
       193 天前
    @liangdi 没勾上 所以是不可用哈哈哈哈
    liangdi
        56
    liangdi  
       193 天前
    @userKamtao 那你把另外两个选项 disabled 调吧!
    fuzqing
        57
    fuzqing  
       193 天前
    很漂亮,配色很好看,但为什么不是两年半???
    userKamtao
        58
    userKamtao  
    OP
       193 天前
    @fuzqing 对!!确实是两年半。
    GG668v26Fd55CP5W
        59
    GG668v26Fd55CP5W  
       193 天前 via iPhone
    学习了,后面考虑在项目使用,佩服 op 对代码的热爱,不要压力太大。
    wuxuehai2020
        60
    wuxuehai2020  
       193 天前
    支持,真熬得住
    zzzyyysss
        61
    zzzyyysss  
       193 天前
    给我信心了!我也要打磨一款,solidJS 的组件库
    jellyX
        62
    jellyX  
       193 天前
    OP 牛逼
    Dragonphy
        63
    Dragonphy  
       193 天前
    很酷啊,做小项目的时候我去试试看怎么样!
    LiLittleCat
        64
    LiLittleCat  
       193 天前
    不错不错,star 了
    zhuang0718
        65
    zhuang0718  
       193 天前
    之前 star 过~加油哦 希望能做项目用上
    gmyxds
        66
    gmyxds  
       193 天前
    很酷,可以学习一下楼主的项目,很厉害了
    首页很炫酷
    但是大项目还是不太敢用哦
    userKamtao
        67
    userKamtao  
    OP
       193 天前
    @gmyxds 是的,我在帖子末尾指出了目前的缺点,大项目还是别用,可能需要一个过程。
    bojue
        68
    bojue  
       193 天前
    表单搭建引擎也吊
    ssteam
        69
    ssteam  
       193 天前
    体验看看
    woodytang
        70
    woodytang  
       193 天前
    很不错!!不过我有一个问题,现在这个年头还用组件库吗?不都是 headless UI ,Shadcn ,Tailwind 这些了吗?
    MoonWalker
        71
    MoonWalker  
       193 天前
    DatePicker 有 bug, 先点上个月某个灰色日期,再选择一个当月的日期。
    MrSheng
        72
    MrSheng  
       193 天前
    很酷,一键三连了~~~
    bladey
        73
    bladey  
       193 天前
    star 支持 👍
    kapaseker
        74
    kapaseker  
       193 天前
    老哥都赚了十个亿了还搞技术推广吗
    userKamtao
        75
    userKamtao  
    OP
       193 天前
    @kapaseker 推广还是要的(首页那个流水只是 demo 啦
    userKamtao
        76
    userKamtao  
    OP
       193 天前
    @MoonWalker 我瞅瞅
    kiroli
        77
    kiroli  
       193 天前
    厉害的 加油
    markyun02
        78
    markyun02  
       193 天前
    @ChainLock 首页关键代码这句:scale(1.1) perspective(1000px) rotateX(12deg) rotateY(-24deg) rotate(8deg) translate(-30px,50px)
    jaycezhang7890
        79
    jaycezhang7890  
       193 天前
    @dbldong 首页这个效果,antd 首页就有这个效果,甚至 antd 还能跟随鼠标晃动
    不有有一说一,基本一个人维护很厉害了,而且首页看起来确实很好看,up 主加油
    zzfly256
        80
    zzfly256  
       193 天前
    耳目一新的感觉;
    提个小需求,不知道能否实现:
    在表单组件上,下拉选项能支持配后台 API 吗,直接从后端接口取下拉选项的内容
    newOpenEyes
        81
    newOpenEyes  
       193 天前
    表单引擎中的上传组件样式有问题,会遮挡其他元素
    leaveeel
        82
    leaveeel  
       193 天前
    支持,我也想过做 ui 组件,不过懒一直没做。
    看了一下组件只有演示和属性,部分属性可选的枚举没有列出来,<Props>可以再加一列可选值,像 icon<props>可以链接到 icon<menu>,objectFit<props>链接到 object-fit<MDN>这样。文档方面可以再完善下。

    DatePicker 格式化那里选完日期再打开选择框上面的年月会变成 NaN 。

    - DateRangePicker 有很多 bug
    - 第一次加载完先选禁用日期再选可用会<Invalid Date>;
    - 重新选择日期/执行清空后,先选禁用再选可用,startDate 会是上次的 startDate ;
    - 先选可用 [A] 再选禁用 [B] hover 会失效,不会更新日期,再点击 [C] 会清空 value 重新赋值给 startDate ;
    - 选中某日期 [A] 后关掉再打开,虽然显示的还是初始值,再选一个日期 [B] 会保存 [A ,B] 的日期范围;简单找了下源码,setValue 方法里 i 再点击的时候就已经进位了,放在判断后面可能就行?没有细看,不过这三个 bug 都是这个导致的。
    - 两个日期框没有联动,实际用一个框就能完成跨月的选择

    Cascader 第一次保存后再展开没有加默认选中,随后再点击其他项 [B] 不保存关闭再展开会默认选中上次选的 [B]

    Pagination 可用加个布局顺序的 props ,参考 elm 的<layout>

    页面上组件展开源码的时候通过右边导航定位有问题,应该是没有更新新的位置,也可以点导航收起源码。
    yelan
        83
    yelan  
       193 天前
    有一个小建议,image 组件加载失败的提示图片,可以用“裂开”的背景图效果会好一点~
    ala2008
        84
    ala2008  
       193 天前
    没有布局吗,响应式
    hereIsChen
        85
    hereIsChen  
       193 天前
    网站首页有点花,至少要把左上角区域标题和开始使用的 2 个按钮区域留出空白
    内容斜着加上流水的数字一直再变
    看着有点难受
    zero3412
        86
    zero3412  
       193 天前
    提个小建议,Table 组件比如在“固定行列”时,横向滚动条能否高一些,现在鼠标不容易点中
    感觉大部分组件库都有这问题
    zhangkui
        87
    zhangkui  
       193 天前
    表单制作器不错
    baihaoyang
        88
    baihaoyang  
       193 天前
    UI 很炫酷,微信小程序可以用吗?
    mzsongyan
        89
    mzsongyan  
       193 天前
    支持,在小项目中用过,很方便,也提过几次 issues ,楼主也很用心的回复了。
    目前来说基本可用了,Table 组件表头要是有排序就好了。
    wjup
        90
    wjup  
       193 天前
    牛逼
    mzsongyan
        91
    mzsongyan  
       193 天前
    @zero3412 可能因为滚动条高了就比较难看,我基本都是用 Shift+鼠标滚轮来操作。
    rrfeng
        92
    rrfeng  
       193 天前 via Android
    手机打开首页。。。一言难尽
    userKamtao
        93
    userKamtao  
    OP
       193 天前
    @ala2008 考虑到组件可能偏后台开发,就没完全适配手机
    @zero3412 我忽略了这一点平时都是按住 shift 来左右滚动,我看看怎么优化。
    @mzsongyan 这个我最近在完善了,因为需要新增的组件太多了,很多想法堆起来,所以这个需求就 delay 了很久。
    @baihaoyang 不支持咧,目前组件就是专注 pc 的后台系统开发
    @hereIsChen 不知道是不是屏幕比例问题,其实左上角已经留空了。我看看怎么适配
    @yelan 这是个很好的建议,我已经 mark 下来啦
    userKamtao
        94
    userKamtao  
    OP
       193 天前
    @jaycezhang7890 其实我在发布第一个版本的时候,我就用了这个效果,我保证我不是抄他的,嘻嘻~
    @zzfly256 这个肯定是支持的,文档有例子
    @newOpenEyes 我瞅瞅,还有这种事!
    @leaveeel 日期组件这里 还需要完善的东西 太多了,任重道远啊,还要加入时间选择,各种场景,我会努力的!
    userKamtao
        95
    userKamtao  
    OP
       193 天前
    @leaveeel 很开心 收到你这么多的建议 感谢啦
    userKamtao
        96
    userKamtao  
    OP
       193 天前
    @zzfly256 可能例子写的不好,应该单独拎出来,searchMethod 这个方法,就可以传入一个通过接口获取数据的方法,只需要把 options 返回即可。
    userKamtao
        97
    userKamtao  
    OP
       193 天前
    @zzfly256 表单引擎的选项请求的话 还在构思配置的实现方式
    mocococ
        98
    mocococ  
       193 天前
    色彩搭配,效果 风格感觉可以再改改或者增加一些,个人还是比较喜欢 mui 这种,更加温和的风格

    https://lew.kamtao.com/#/Alert

    https://mui.com/material-ui/react-alert/

    OP 的 UI 库 看上去很像 ant.design , 但是 功能性组件还是有点少。人少写这种确实比较耗时间。
    userKamtao
        99
    userKamtao  
    OP
       193 天前
    @mocococ 好!你喜欢这种,那我直接抄他的风格。看上去很像 ant ,那我要抄一抄 mui ,把好的抄过来。个人精力很有限,而且应该会越来越多的!
    ms2297248353
        100
    ms2297248353  
       192 天前
    我是有个需求,我在开发 Halo 插件时,插件用的也是 Vue, 但是因为插件的缘故,官方提供的组件很简单,写起来一点都不顺手。安装 arco 后 vite 自动导入组件,但是最终,样式全部没有。有没有可能组件完全独立化,安装单个组件,可以直接使用,不用全量安装,样式跟随组件走,也不会造成样式丢失的问题。
    1  2  
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3626 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 37ms · UTC 04:20 · PVG 12:20 · LAX 21:20 · JFK 00:20
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.