fish-ui 一套基于 vue2 的 ui 组件库

[myliang]

A Vue.js 2.0 UI Toolkit for Web.
git: https://github.com/myliang/fish-ui

安装

npm install less less-loader -S
npm install fish-ui -S

快速开始

导入所有组件

import Vue from 'vue'
import FishUI from 'fish-ui'

Vue.use(FishUI)

按需导入组件

import Button from 'fish-ui/src/components/Button.vue'
import 'fish-ui/styles/base.less'
import 'fish-ui/styles/button.less'

实例

https://myliang.github.io/fish-ui/

特性

• Equip with Vue.js, Moment, Vue-Router, ES6 & Babel 6
• Cool with Webpack 2.0 & Vue Loader
• Semantic CSS Components
• Stylesheets in Less

所有组件

• BackTop
• Button
• Buttons
• Calendar
• Card
• Carousel
• CarouselItem
• Cascader
• Checkbox
• Checkboxes
• Col
• DatePicker
• Dropdown
• Field
• Fields
• Form
• Input
• InputNumber
• Layout
• Menu
• Message
• Modal
• Option
• Pagination
• Radio
• Radios
• Row
• Select
• Steps
• Step
• Submenu
• Table
• TabPane
• Tabs
• Tag
• Tags
• TimePicker
• Upload
• Tree
• Tree Select
• Transfer
• Devider
• Image
• Timeline

浏览器支持

Modern browsers and Internet Explorer 9+(no test).

Thanks to

• semantic-ui

LICENSE

MIT

[myliang]

欢迎各位使用，提问 https://github.com/myliang/fish-ui/issues

[lhx2008]

还挺好看的，赞

[wwqgtxx]

不打算适配一下移动端么

[66beta]

移动端好的库太少，饿了么的 mint-ui 兼容性一般性能也不好，倒是 didi 的 cube-ui 可以一战，但是目前组件太少

[myliang]

@wwqgtxx 有这计划，貌似移动端的需求更大

[myliang]

@66beta 我开发这个组件库也是因为没什么太适合自己，开来有必要开发个移动端的

[wwqgtxx]

@myliang 对于很多小网站来说，一套能同时适配移动端和桌面端的 ui 库能大幅度提高开发效率

[myliang]

@wwqgtxx 明白，谢谢你提议，很多人也提过这个，后面添加支持

[dilu]

好看 果断 star 又多了一个选择

[myliang]

@dilu thx

[myliang]

已经更新到了 1.0.93 版本，重构了 select 的样式

[myliang]

@wwqgtxx 最近版本已经支持移动端了

[wwqgtxx]

@myliang 刚刚试了一下 demo，貌似忘记处理当列表还有代码框超出屏幕宽度的时候需要加上横向滚动条的问题了吧

[myliang]

@wwqgtxx 你是说的 table 是吗？

[wwqgtxx]

你试试在 chrome 开发者模式下看看这个页面 https://myliang.github.io/fish-ui/#/components/checkbox
很多地方文字超出范围了怎么都拖不出来

[myliang]

@wwqgtxx 问题已解决，谢谢你！

[wwqgtxx]

昨天用 fish-ui 写了一个小项目，提点意见吧
文档写的实在是，，，各种组件没有分类都混在一起，除非看提供的例子，否则根本不知道该如何组合使用。
然后有些组件的属性并没有列在文档中（ table 分页那部分），要自己查源代码才能找到
另外有些组件虽然可以复用，比如 fish-option，在 form 和 menu 中都有使用，文档中却没有说明其在不同父容器中使用的区别
fish-menu 中使用的 fish-option 和 vue-router 配合的并不好，需要手动写 click 事件，且还在在 mount 的时候加钩子来激活确定当前页，设置 default-active 属性
fish-table 的扩展菜单只能通过 render 函数实现，然而大部分人还是用 vue-loader 写的.vue 组件，render 的编写对于初学者过于复杂了，是不是可以考虑中 slot 解决这个问题

目前暂时就这么多，最后提一个，fish-ui 各个组件的 src 看着还是很清晰的，但是官方文档部分的源代码实在是看不懂，建议重构一下，毕竟这也是给各位使用者最好的例子

[myliang]

@wwqgtxx 谢谢你建议，这些问题我会最近修复，可以提 github, issue

[myliang]

@wwqgtxx 其实小真实的 demo,你可以看看我这个项目 https://github.com/myliang/fish-admin

[wwqgtxx]

@myliang fish-admin 我也看过，不过这个毕竟是需要在本地部署之后才能看效果，而且的确过于小了，很多内容都没有涉及到，而 fish-ui 的 doc 是可以直接看的，而且基本上覆盖了 fish-ui 所有的组件的用法，所以在细节方面参考价值更大