vuejs前端框架製作網頁（web前端框架vue）

本文目錄一覽：

• 1、vue框架是幹什麼的
• 2、號稱目前最火的前端框架Vue，它有什麼顯著特點呢？
• 3、bootstrap+vue.js做前端框架的特點

vue框架是幹什麼的

Vue 是一套用於構建用戶界面的漸進式JavaScript框架。 與其它大型框架不同的是，Vue 被設計為可以自底向上逐層應用。Vue 的核心庫只關注視圖層，不僅易於上手，還便於與第三方庫或既有項目整合。另一方面，當與現代化的工具鏈以及各種支持類庫結合使用時，Vue 也完全能夠為複雜的單頁應用（SPA）提供驅動。

Vue.js 的目標是通過儘可能簡單的 API 實現響應的數據綁定和組合的視圖組件 。

Vue.js 自身不是一個全能框架——它只聚焦於視圖層。因此它非常容易學習，非常容易與其它庫或已有項目整合。另一方面，在與相關工具和支持庫一起使用時 ，Vue.js 也能地驅動複雜的單頁應用。

號稱目前最火的前端框架Vue，它有什麼顯著特點呢？

1、Vue是什麼

Vue.js 是目前最火的一個前端框架，除了可以開發網站，還可以開發手機App。

Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，並成為前端三大主流框架。

Vue.js 是一套構建用戶界面的框架，只關注視圖層，它不僅易於上手，還便於與第三方庫或既有項目整合。

Vue.js 是一套用於構建用戶界面的漸進式框架。

2、Vue的特點

遵循 MVVM 模式

編碼簡潔，體積小，運行效率高，適合移動/PC 端開發

它本身只關注 UI, 可以輕鬆引入 vue 插件或其它第三庫開發項目

3、Vue與其他前端框架的關係

借鑒 angular 的模板和數據綁定技術

借鑒 react 的組件化和虛擬 DOM 技術

4、Vue的現有插件

vue-cli: vue 腳手架，用於搭建項目的骨架

vue-resource(axios): ajax 請求

vue-router: 路由

vuex: 狀態管理

vue-lazyload: 圖片懶載入

vue-scroller: 頁面滑動相關

mint-ui: 基於 vue 的 UI 組件庫(移動端)

element-ui: 基於 vue 的 UI 組件庫(PC 端)

5、學習Vue的思想改變

Vue的中心思想是數據驅動，像遠古時代的老前輩jQuery是結構驅動。

大家回憶下以前我們使用jQuery寫代碼的時候，經常是這樣寫的：

$(“#myDiv”).html(“HelloWorld”);

這些寫法首先要獲取Dom節點，也就是Dom結構，然後再修改數據更新結構的內容，使用jQuery的一個很大的目的就是為了去簡化Dom的操作，而使用Vue就大不一樣了，Vue的做法就是直接this.msg=HelloWorld，然後msg就會自動的同步到結構上，我們所要關心的是數據內容的改變，而不再去關心如何操作Dom結構了。

總結一句話：不要在想著怎麼操作DOM，而是想著如何操作數據!!

bootstrap+vue.js做前端框架的特點

1、易於開發：bootstrap+vue.js提供了頁面數據渲染模板引擎如v-ifv-for等、提供事件綁定@click等，代碼清晰明了，邏輯簡單，易於上手。

2、高性能：bootstrap+vue.js提出虛擬DOM概念，以及數據驅動DOM思想，減少頁面渲染成本，大幅度提高性能。

3、生態完善：許多開發者提供了對bootstrap+vue.js支持的插件如ElementUI，完善bootstrap+vue.js的生態，故使用bootstrap+vue.js進行開發，遇到的難題會較少。

4、開源社區活躍：這提供bootstrap+vue.js未來更加強大的可能性。