cn.vuejs,cnvuejsorg

本文目錄一覽：

• 1、vue.js created 是什麼意思
• 2、解析如何學習Vue框架快速入門
• 3、什麼是vue框架？
• 4、Vue.js的data是要一個對象還是一個function

vue.js created 是什麼意思

vue.js created是它的一個生命周期鉤子函數，就是一個vue實例被生成後調用這個函數。Vue.js是一個構建數據驅動的web界面的漸進式框架，

一個vue實例被生成後還要綁定到某個html元素上，之後還要進行編譯，然後再插入到document中。每一個階段都會有一個鉤子函數，方便開發者在不同階段處理不同邏輯。

擴展資料

Vue.js：

讀音 [vju:]。Vue.js 的目標是通過儘可能簡單的 API 實現響應的數據綁定和組合的視圖組件。它不僅易於上手，還便於與第三方庫或既有項目整合。

另一方面，當與單文件組件和 Vue 生態系統支持的庫結合使用時，Vue 也完全能夠為複雜的單頁應用程序提供驅動。

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

參考資料來源：百度百科——Vue.js

解析如何學習Vue框架快速入門

Vue框架算是比較高級的框架，所以在使用過程中還需要JavaScript、JavaScript 2015、WebPack、NodeJS、npm、ESLint、JavaScript單元測試框架等其他知識和框架的使用方法。在學習Vue之前，最好先學習一下這些知識。由於Vue的中文文檔比較完善，所以這裡只介紹Vue框架的一些核心概念，詳細的使用方法還得查看官方文檔。

Vue的中文文檔可以查看 。

Vue路由功能需要導入vue-router，它的中文文檔可以查看 。

Vue的狀態管理功能需要使用vuex，它的中文文檔可以查看 。

如果需要更多Vue資料，可以查看awesome-vue，列舉了很多Vue資源。

當然最簡單和直接的還是看視頻，到百度網盤上面搜索下，慕課網的vue2.0從基礎到實踐是我感覺非常好的一套視頻，你對著做下，或者找個項目邊做邊學，能很快提高，另外iview是一個很不錯的東西，等你學會了vue的基本應用，研究下iview封裝好的component，就能作出很漂亮的網頁了

什麼是vue框架？

什麼是vue

是一套構建用戶界面的漸進式（用到哪一塊就用哪一塊，不需要全部用上）前端框架，Vue 的核心庫只關注視圖層

vue的兼容性

Vue.js 不支持 IE8 及其以下版本，因為 Vue.js 使用了 IE8 不能模擬的 ECMAScript 5 特性。 Vue.js 支持所有兼容 ECMAScript 5 的瀏覽器。

vue學習資源

vue.js中文官網：

vue.js源碼：

vue.js官方工具：

vue.js官方論壇：forum.vuejs.org

對比其他框架-React

React 和 Vue 有許多相似之處，它們都有使用 Virtual DOM；提供了響應式（Reactive）和組件化（Composable）的視圖組件。將注意力集中保持在核心庫，而將其他功能如路由和全局狀態管理交給相關的庫。React 比 Vue 有更豐富的生態系統

都有支持native的方案，React的RN，vue的Wee下

都支持SSR服務端渲染

都支持props進行父子組件間的通信

性能方面：React 和 Vue 在大部分常見場景下都能提供近似的性能。通常 Vue 會有少量優勢，因為 Vue 的 Virtual DOM 實現相對更為輕量一些。

不同之處就是：

數據綁定方面，vue實現了數據的雙向數據綁定，react數據流動是單向的

virtual DOM不一樣,vue會跟蹤每一個組件的依賴關係,不需要重新渲染整個組件樹.而對於React而言,每當應用的狀態被改變時,全部組件都會重新渲染,所以react中會需要shouldComponentUpdate這個生命周期函數方法來進行控制

state對象在react應用中不可變的,需要使用setState方法更新狀態;在vue中,state對象不是必須的,數據由data屬性在vue對象中管理（如果要操作直接this.xxx）

組件寫法不一樣, React推薦的做法是 JSX , 也就是把HTML和CSS全都寫進JavaScript了,即’all in js’; Vue推薦的做法是webpack+vue-loader的單文件組件格式,即html,css,js寫在同一個文件

對比其他框架-angular

在性能方面，這兩個框架都非常的快，我們也沒有足夠的實際應用數據來下一個結論。如果你一定想看些數據的話，你可以參考這個第三方跑分。單就這個跑分來看，Vue 似乎比 Angular 要更快一些。

在大小方面，最近的 Angular 版本中在使用了 AOT 和 tree-shaking 技術後使得最終的代碼體積減小了許多。但即使如此，一個包含了 vuex + vue-router 的 Vue 項目 (30kb gzipped) 相比使用了這些優化的 Angular CLI 生成的默認項目尺寸 (~130kb) 還是要小的多。

靈活性：Vue 相比於 Angular 更加靈活，Vue 官方提供了構建工具來協助你構建項目，但它並不限制你去如何組織你的應用代碼。有人可能喜歡有嚴格的代碼組織規範，但也有開發者喜歡更靈活自由的方式。

vue.js的核心特點—響應的數據綁定

傳統的js操作頁面：在以前使用js操作頁面的時候是這樣的，需要操作某個html元素的數據，就的使用js代碼獲取元素然後在處理業務邏輯

響應式數據綁定的方式操作頁面，可以直接使用像下面代碼那樣的寫法就可以將數據填充到頁面中

template

div id=”app”

{{ message }}

/div

/template

script

export default {

name: ‘app’,

data () {

return {

message: ‘Welcome to Your Vue.js App’

}

}

}

/script

style

/style

vue.js的核心特點—可組合的視圖組件

一個頁面映射為組件樹。劃分組件可維護、可重用、可測試，也就是一個頁面由多個組件組合而成

vue中實現組件引入示例

第一步：import導入需要引入的組件文件；

第二步：註冊組件；

第三步：在需要引入組件的文件中加上組件標籤（這個標籤的標籤名就是註冊的組件名字，多個單詞的和這裡有xx-xx的形式）

需要注意的是：組件可以嵌套引入，也就是說組件可以引入其他組件

首先創建一個組件，用於被引入的組件，組件名字叫Hello.vue

————————————————

版權聲明：本文為CSDN博主「胡椒粉0121」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。

Vue.js的data是要一個對象還是一個function

在一個普通的 Vue app 中，data 是一個對象： new Vue( { data : { title : ‘abc’ }} ); 在 Vue 的 Component 中，data 要寫成一個 function，並返回對象： Vue.component( ‘component-name’, Vue.extend( { data : function()