標(biāo)簽(空格分隔): JavaScript框架
兼容性說明:
Vue.js 不支持 IE8 及其以下版本,因?yàn)?Vue.js 使用了 IE8 不能模擬的 ECMAScript 5 特性。 Vue.js
支持所有兼容 ECMAScript 5 的瀏覽器。
一、安裝
1.獨(dú)立版本CDN
直接下載并用 <script> 標(biāo)簽引入,Vue 會(huì)被注冊為一個(gè)全局變量。
開發(fā)版本
生產(chǎn)版本
注意:
2.NPM
$ npm install vue
3.命令行工具
Vue.js 提供一個(gè)官方命令行工具vue-cli,可用于快速搭建大型單頁應(yīng)用。可快速創(chuàng)建并啟動(dòng)一個(gè)帶熱重載、保存時(shí)靜態(tài)檢查以及可用于生產(chǎn)環(huán)境的構(gòu)建配置的項(xiàng)目:
#全局安裝 vue-cli
$ npm install --global vue-cli
# 創(chuàng)建一個(gè)基于 webpack 模板的新項(xiàng)目
$ vue init webpack my-project
# 安裝依賴,走你
$ cd my-project
$ npm install
$ npm run dev
二、Vue實(shí)例
1.構(gòu)造器
每個(gè) Vue.js 應(yīng)用都是通過構(gòu)造函數(shù) Vue 創(chuàng)建一個(gè) Vue 的根實(shí)例 啟動(dòng)的:
var vm = new Vue({
// 選項(xiàng)
})
實(shí)例化 Vue 時(shí),需要傳入一個(gè)選項(xiàng)對象,它可以包含數(shù)據(jù)、模板、掛載元素、方法、生命周期鉤子等選項(xiàng)。
2.屬性與方法
API 參考
3.實(shí)例生命周期
每個(gè) Vue 實(shí)例在被創(chuàng)建之前都要經(jīng)過一系列的初始化過程。在這個(gè)過程中,實(shí)例也會(huì)調(diào)用一些 生命周期鉤子,這就給我們提供了執(zhí)行自定義邏輯的機(jī)會(huì)。例如,created 這個(gè)鉤子在實(shí)例被創(chuàng)建之后被調(diào)用:
var vm = new Vue({
data: {
a: 1
},
created: function () {
// `this` 指向 vm 實(shí)例
console.log('a is: ' + this.a)
}
})
// -> "a is: 1"
