vue從零開始使用

這次帶給大家vue從零開始使用，vue從零開始使用的注意事項有哪些，下面就是實戰案例，一起來看一下。

一、vue是什麼

Vue 是一套用來建立使用者介面的 漸進式框架 。

壓縮後僅有17kb

二、vue環境建置

你直接下載並用 標籤引入， Vue 會被註冊為一個全域變數。

但在用 Vue 建置大型應用程式時建議使用 NPM 安裝。

這裡推薦一下是用淘寶的cnpm，非常的快

npm install -g cnpm --registry=https://registry.npm.taobao.org 然後進行安裝

# 全局安装 vue-cli npm install --g vue-cli # 创建一个基于 webpack 模板的新项目 vue init webpack my-project # 安装依赖，走你 cd my-project npm run dev 三、第一個vue應用

单击事件 今年{{age}}

#四、Vue生命週期

每個Vue 實例創建時，都會經歷一系列的初始化過程，同時也會呼叫對應的生命週期鉤子，我們可以利用這些鉤子，在適當的時機執行我們的業務邏輯。

大體上的生命週期就是：創建（created)---掛載(mounted)---銷毀(destroy)

Vue 的生命週期鉤子比較常用的有：

• created 實例建立完成後調用，此階段完成了資料的觀測等， 但尚未掛載， $el 還不可用。需要初始化處理一些資料時會比較有用．

• mounted el 掛載到實例上後調用， 一般我們的第一個業務邏輯會在這裡開始。

• beforeDestroy 實例銷毀之前呼叫。主要解綁一些使用addEventListener 監聽的事件等。

var app =new Vue({ el: '# app', data: { a: 2 } , created: function () { console.log(this.a); //2 }, mounted: function () { console.log(this.el); //

} }); 完整的一個生命週期圖：

#相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！