介紹

BootStrap是世界上最受歡迎的構建響應式移動優(yōu)先網站的框架，Vue是當前最流行的前端框架之一，BootstrapVue則是將兩者相結合，使用BootstrapVue，可以使用Vue.js和前端CSS庫--Bootstrap v4在Web上構建響應式，移動優(yōu)先項目。BootstrapVue具有超過40個插件和超過75個自定義組件，為Vue.js提供了最全面的Bootstrap v4組件和網格系統(tǒng)實現之一。具有廣泛的自動WAI-ARIA(無障礙)可訪問性標記！

---

---

如何獲取？

Github關鍵字：bootstrap-vue

---

---

相關特性

• 響應式

移動優(yōu)先的響應式布局

---

• 模塊化

僅導入所需的功能

---

• 可靠性

自動WAI-ARIA可訪問性標記

---

• 現代化

使用Vue.js v2.6和Bootstrap SCSS v4.3構建

---

• 可配置

使用SCSS變量和全局選項創(chuàng)建主題

---

• 開源免費

基于MIT許可證在GitHub上開源

組件介紹

BootstrapVue提供了豐富的組件和插件，已經基本滿足我們日常開發(fā)的需求

• Alerts

---

---

• 按鈕

I am a ButtonI am a Link

---

---

• 卡片

---

---

• 輪播圖

可自動或者手動切換

---

---

• 隱藏內容

輕松切換頁面上幾乎任何內容的可見性。包括制作手風琴的支持。

---

---

• 響應式嵌入

通過創(chuàng)建可在任何設備上縮放的內在比率，根據父級的寬度創(chuàng)建響應式視頻或幻燈片嵌入

---

---

---

• 表單

---

---

---

• 模態(tài)框

---

---

• 表格

---

---

以上是選擇性的預覽一些組件，更多組件可以選擇查看官網文檔

安裝使用

# With npmnpm install vue bootstrap-vue bootstrap# With yarnyarn add vue bootstrap-vue bootstrap

然后，在app入口點注冊BootstrapVue插件：

// app.jsimport Vue from 'vue'import BootstrapVue from 'bootstrap-vue'Vue.use(BootstrapVue)

并導入Bootstrap和BootstrapVue css文件：

// app.jsimport 'bootstrap/dist/css/bootstrap.css'import 'bootstrap-vue/dist/bootstrap-vue.css'

或者scss通過單個自定義SCSS文件導入Bootstrap和BootstrapVue 文件：

// custom.scss@import 'node_modules/bootstrap/scss/bootstrap';@import 'node_modules/bootstrap-vue/src/index.scss';// app.jsimport 'custom.scss'

BootstrapVue還提供了和Nuxt.js、Vue CLI2、Vue CLI3一起使用的模板，用法很多，可以到Github上獲取相關文檔地址！

總結

Vue+BootStrapV4，使構建響應式Web應用變得更加簡單，雖然功能上并不是很強大，但是其主要還是界面上的優(yōu)勢，感興趣的小伙伴可以學習一下！

總結

以上是生活随笔為你收集整理的vue如何获取年月日_BootstrapVue——Vue和Bootstrap的相结合，构建响应式应用更简单...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。