打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
9个适用于React,Vue,Angular的Bootstrap UI组件库

Bootstrap是世界上最受欢迎的前端框架,旨在能让各种工具保持一致。它包含排版,表单,按钮,以及基于HTML和CSS的网站模板与其他UI组件。
随着React,Vue和Angular之类的框架和库的兴起,我们构建的许多项目都将Bootstrap列入一组可重用的UI组件。
为了帮助你快速入门,我们收集了一些最佳的UI组件,这些组件使用现代框架实施Bootstrap。而使用这些组件常常被开发者社区中的很多人认为是明智的选择
使用Bit(GitHub),你可以发现并重用这些库或你自己的组件中的特定组件。并与NPM / Yarn一起安装使用。

1、React Bootstrap

React-bootstrap可能是React中最流行的Bootstrap 3 + Bootstrap 4组件实现(1.4万 stars ,每周下载30万次)。每个组件都是作为React组件从头开始构建的,完全依赖于Bootstrap样式表来与现有的Bootstrap主题一起使用。

2、Reactstrap

Reactstrap是一个“无状态React Bootstrap 4组件”库,具有超过6K stars ,不依赖于Bootstrap Javascript。但是,依赖于通过react-popper的Poppers.js来对内容进行高级定位,例如工具提示,弹出窗口和自动翻转下拉菜单。内容由props.children组成,而不是使用命名的props传递到Components中。

3、 Material Design React Bootstrap

这个库是一组带有Material Design的React Bootstrap组件。组件提供了跨浏览器的兼容性,可与Chrome,Firefox,Safari,Opera和Microsoft Edge完美配合。包括对Flexbox布局系统的全面支持,以帮助解决对齐问题,并且文档丰富且有用。你可以观看此简短的快速入门视频(视频地址:https://www.youtube.com/watch?v=ozXDtSi5ByM)以帮助你快速使用。

4、BootstrapVue

BootstrapVue是适用于Vue.js的Bootstrap 4组件,网格系统的全面实现,颇受开发者的欢迎,(有6.5k stars ),它带有大量且自动的WAI-ARIA可访问性标记。它是为了使用Vue.js和Bootstrap 4 进行响应式开发,移动项目优先而构建的。它还提供了两个有用的vue-cli模板webpack-simple和webpack。

5、UIV

在Vue 2中实现的一组Bootstrap 3 UI组件。它轻巧,所有组件压缩了20KB,仅依赖于Vue和Bootstrap CSS。你可以单独导入组件,这些组件所有现代浏览器(IE 9+)均支持,还支持SSR。

6、Material Design React Bootstrap

该库具有400多个UI元素,600个图标和70个CSS动画,是基于Bootstrap和Vue功能的,有丰富的UI组件。其主要优势是响应速度快,兼容大部分浏览器并且可进行高度定制。

7、NG Bootstrap

Angular 6和Bootstrap 4是使用Angular组件构建的响应式布局的组合组件。NG-Bootstrap用TypeScript编写,具有100%的测试覆盖率,它唯一的依赖项是Angular和Bootstrap 4 CSS,并且此组件库在进行积极维护。

8、AngularJS Bootstrap

目前有15k stars,该库是一组用于Bootstrap的Native AngularJS指令,这些指令占用空间小(压缩20kb),并且没有JS依赖项(jQuery,bootstrap JS)。你可以在这里(地址:http://angular-ui.github.io/bootstrap/#!#getting_started)下载v2.5,并在这里(地址:http://angular-ui.github.io/bootstrap/#!#getting_started)查看指令。

9、NGX Bootstrap

ngx-bootstrap 有4.5K stars 。使用Angular实现Bootstrap 3和4小部件。它包含所有Bootstrap 标记和Bootstrap CSS核心组件,因此你无需使用原始JS组件。你就可以实现自己的模板和样式,并且所有组件的设计都具有可扩展性和适应性,并具有针对移动设备和台式机的标准化性能。你可以在这里(地址:https://valor-software.com/ngx-bootstrap/#/)尝试组件。

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
优秀的Web前端工程师应该具备这些条件,你都会吗?
别再学那些落后的Web 开发技术了 !
前端框架及组件库选型分析
Vue和React大比拼,你pick谁?
20个为前端开发者准备的文档和指南
几个前端UI框架的的比较
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服