vuejs和bulma的區(qū)別有哪些

這篇文章主要介紹了vuejs和bulma的區(qū)別有哪些，具有一定借鑒價值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

區(qū)別：vuejs是一套構建用戶界面的漸進式JavaScript框架，其目標是通過盡可能簡單的API實現(xiàn)響應式的數(shù)據(jù)綁定和可組合的視圖組件；而Bulma是一個基于Flexbox的現(xiàn)代化的CSS框架，用于實現(xiàn)各種簡單或者復制的響應式內容布局。

本教程操作環(huán)境：windows7系統(tǒng)、vue2.9.6版，DELL G3電腦。

vuejs是什么？

Vue.js（讀音/vju：/，發(fā)音類似于view）是一套構建用戶界面的漸進式框架。與其他重量級框架不同的是，Vue 采用自底向上增量開發(fā)的設計。

Vue 的核心庫只關注視圖層，并且非常容易學習，也非常容易與其他庫或已有項目整合。Vue 完全有能力驅動采用單文件組件和 Vue 生態(tài)系統(tǒng)支持的庫開發(fā)的復雜單頁應用。

Vue.js 還提供了 MVVM 數(shù)據(jù)綁定和一個可組合的組件系統(tǒng)，具有簡單、靈活的 API，其目標是通過盡可能簡單的 API 實現(xiàn)響應式的數(shù)據(jù)綁定和可組合的視圖組件。

我們也可以說 Vue.js 是一套響應式系統(tǒng)（Reactivity System）。數(shù)據(jù)模型層（Model）只是普通 JavaScript 對象，如下圖所示，{ }代表一個 JavaScript 對象，修改它則更新相應的 HTML 片段（DOM），這些 HTML 片段也稱為“視圖（view）”。這會讓狀態(tài)管理變得非常簡單且直觀，可實現(xiàn)數(shù)據(jù)的雙向綁定，所以我們也稱之為響應式系統(tǒng)。

Vue.js 的主要特點

Vue.js 是一個優(yōu)秀的前端界面開發(fā) JavaScript 庫，它之所以非常火，是因為有眾多突出的特點，其中主要的特點有以下幾個。

1) 輕量級的框架

Vue.js 能夠自動追蹤依賴的模板表達式和計算屬性，提供 MVVM 數(shù)據(jù)綁定和一個可組合的組件系統(tǒng)，具有簡單、靈活的 API，使讀者更加容易理解，能夠更快上手。

2) 雙向數(shù)據(jù)綁定

聲明式渲染是數(shù)據(jù)雙向綁定的主要體現(xiàn)，同樣也是 Vue.js 的核心，它允許采用簡潔的模板語法將數(shù)據(jù)聲明式渲染整合進 DOM。

3) 指令

Vue.js 與頁面進行交互，主要就是通過內置指令來完成的，指令的作用是當其表達式的值改變時相應地將某些行為應用到 DOM 上。

4) 組件化

組件（Component）是 Vue.js 最強大的功能之一。組件可以擴展 HTML 元素，封裝可重用的代碼。

在 Vue 中，父子組件通過 props 傳遞通信，從父向子單向傳遞。子組件與父組件通信，通過觸發(fā)事件通知父組件改變數(shù)據(jù)。這樣就形成了一個基本的父子通信模式。

在開發(fā)中組件和 HTML、JavaScript 等有非常緊密的關系時，可以根據(jù)實際的需要自定義組件，使開發(fā)變得更加便利，可大量減少代碼編寫量。

組件還支持熱重載（hotreload）。當我們做了修改時，不會刷新頁面，只是對組件本身進行立刻重載，不會影響整個應用當前的狀態(tài)。CSS 也支持熱重載。

5) 客戶端路由

Vue-router 是 Vue.js 官方的路由插件，與 Vue.js 深度集成，用于構建單頁面應用。Vue 單頁面應用是基于路由和組件的，路由用于設定訪問路徑，并將路徑和組件映射起來，傳統(tǒng)的頁面是通過超鏈接實現(xiàn)頁面的切換和跳轉的。

6) 狀態(tài)管理

狀態(tài)管理實際就是一個單向的數(shù)據(jù)流，State 驅動 View 的渲染，而用戶對 View 進行操作產(chǎn)生 Action，使 State 產(chǎn)生變化，從而使 View 重新渲染，形成一個單獨的組件。

bulma是什么？

Bulma 是一個基于 Flexbox 的現(xiàn)代化的 CSS 框架，設計的初衷就是移動優(yōu)先（Mobile First），模塊化設計，可以輕松用來實現(xiàn)各種簡單或者復制的響應式內容布局，瀏覽器支持：瀏覽器支持：Chrome、Edge、Firefox、Internet Explorer (10+)、Opera 以及 Safari。

bulma有以下特性：

• 輕量級的現(xiàn)代CSS框架，使用Flexbox

• 支持響應式布局，網(wǎng)格等

• 純CSS，沒有Javascript代碼

• 可定制、模塊化

優(yōu)點：

• 為電腦、平板和手機提供響應式設計

• 純CSS框架，很容易與JavaScript框架集成，如VueJS, ReactJS等

• 代碼優(yōu)雅簡潔

運行效果

列的示例。只要添加列，它們會自動調整自己的大小

魔術瓷磚（Magic tiles）

Metro UI CSS 網(wǎng)格的單個元素

感謝你能夠認真閱讀完這篇文章，希望小編分享的“vuejs和bulma的區(qū)別有哪些”這篇文章對大家有幫助，同時也希望大家多多支持億速云，關注億速云行業(yè)資訊頻道，更多相關知識等著你來學習!