一只高扩展性的vue组件库 —— JSMOD

HmyBmny 发布于2019-08-20 17:22 / 1582人阅读

摘要：在开发面向用户站点时，通常由给出，这时需要组件库有丰富的自定义样式能力同时保留默认提供基础样基于这点再看大部分的中后台组件库并不能满足需求，为大家介绍一只高扩展性组件项目项目相关文档示例一句装的目标提供高自由度高扩展性的组件集合，并统一桌面

在开发面向用户站点时，UI 通常由 designer 给出，这时需要组件库有丰富的自定义样式能力（同时保留默认提供基础样）

基于这点再看大部分的中后台组件库并不能满足需求，为大家介绍一只高扩展性 UI 组件项目 JSMOD VUE PC

项目相关

文档|示例

Github

一句装b的目标

提供高自由度（高扩展性）的组件集合，并统一桌面端、移动端的使用方式，是一个面向用户端的组件库

王哲君的自定义之路

一、王哲君接了一个农药管理的项目，在实现需求时使用了JSMOD For Vue 作为其组件库，使用确认对话窗时他可以简单的使用如下代码

得到了一个简单的默认样式

二、L爸爸觉得蓝色的风格他不喜欢，喜欢（河对面的）红色，且有描边的样式

通过使用简单的样式对象，王哲君满足了L爸爸的诉求

三、暴君是整个项目的 Boss，他希望弹窗的布局要走非主流，于是设计如下

使用如下代码，农药君拿到了他的奖励buff

为自定义元素加入 mod-confirm 标识即可继承点击事件

其他的自定义方式

JSMOD VUE PC 在设计时为开发者提供了丰富的自定义样式（布局）的方式，甚至你可以使用作用域插槽更改组件的 DOM 结构

分页默认提供如下样式：

使用作用域插槽你可以简单将样式改为（满足designer）：

具体使用方式搓JSMOD PAGINATION查看吧 王者君就不细说了

快节奏的开发

JSMOD VUE PC 提供了对图片的丰富扩展，你可以像使用原生标签一样使用，同时得到了如下功能：

内置懒加载功能

等比缩放（再也不用关心产品上传的图片不符合规格导致拉伸）

loading 加载中的动画、加载完毕的渐变特效都帮你搞定，且可以自行选择 loading 图片，和是否启用这些功能

加载失败替换图片（甚至可以替换为dom结构），点击下是否重新加载

访问 JSMOD IMAGE 模块看看能不能帮助到你的项目

保持最小集

jsmod 目前提供的组件比较少，但每个都是自定义丰富。移除了栅格字体图标等功能（用户端产品往往都有自己的UI标准），专注提供可扩展的组件库

40k（gizp）的体积（包括了所有的js，css，icon，svg）打包到单一 js，让你随意使用

王哲君想说的

Mobile 版本正在开发中，目标提供统一的vue组件使用体验

加入awesome-vue，提供了 Chinese English 文档

持续更新组件但保持装B的目标不变提供高自由度（高扩展性）的组件集合

专线服务云服务器 vue组件 vue组件开发 vue父子组件通讯 vue轮播组件

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/83534.html

2017-06-20 前端日报

摘要：前端日报精选专题之跟着学节流冴羽的博客全家桶仿微信项目，支持多人在线聊天和机器人聊天腾讯前端团队社区编码的奥秘模块实现入门浅析知乎专栏前端每周清单发布新版本提升应用性能的方法中文寇可往吾亦可往用实现对决支付宝的微信企业付款到零 2017-06-20 前端日报精选 JavaScript专题之跟着 underscore 学节流 - 冴羽的JavaScript博客 - SegmentFau...

Galence 2019-08-20 17:23 评论0 收藏0
搜集React、Vue、Angular和传统UI组件库以及后台管理平台模板

摘要：高颜值好用易扩展的微信小程序库，有赞。一套高质量的微信小程序组件库。用和搭建的一个通用管理后台基于实现的后台管理系统模板一个后台管理系统模板是一套组件化框架，支持定制主题，主要服务于前台及中后台产品。基于后台管理系统。快来Star，在这里哦Awesome UIKit。 showImg(https://segmentfault.com/img/remote/14600000059942...

zhangrxiang 2019-08-29 13:59 评论0 收藏0
搜集React、Vue、Angular和传统UI组件库以及后台管理平台模板

摘要：高颜值好用易扩展的微信小程序库，有赞。一套高质量的微信小程序组件库。用和搭建的一个通用管理后台基于实现的后台管理系统模板一个后台管理系统模板是一套组件化框架，支持定制主题，主要服务于前台及中后台产品。基于后台管理系统。快来Star，在这里哦Awesome UIKit。 showImg(https://segmentfault.com/img/remote/14600000059942...

source 2019-08-21 18:01 评论0 收藏0
前端资源分享-只为更好前端

摘要：一团队组织网站说明腾讯团队腾讯前端团队，代表作品，致力于前端技术的研究腾讯社交用户体验设计，简称，腾讯设计团队网站腾讯用户研究与体验设计部百度前端研发部出品淘宝前端团队用技术为体验提供无限可能凹凸实验室京东用户体验设计部出品奇舞团奇虎旗下前一、团队组织网站说明腾讯 AlloyTeam 团队腾讯Web前端团队，代表作品WebQQ，致力于前端技术的研究 ISUX 腾...

zxhaaa 2019-08-22 16:11 评论0 收藏0
前端资源分享-只为更好前端

摘要：一团队组织网站说明腾讯团队腾讯前端团队，代表作品，致力于前端技术的研究腾讯社交用户体验设计，简称，腾讯设计团队网站腾讯用户研究与体验设计部百度前端研发部出品淘宝前端团队用技术为体验提供无限可能凹凸实验室京东用户体验设计部出品奇舞团奇虎旗下前一、团队组织网站说明腾讯 AlloyTeam 团队腾讯Web前端团队，代表作品WebQQ，致力于前端技术的研究 ISUX 腾...

JouyPub 2019-08-02 10:10 评论0 收藏0