初入Vue的世界，對這個世界的路線和環境都還是處於未知和好奇中,
而在探索的過程中，只有寫將地圖和風景記錄在旅遊手冊裏，下次才能更好的翻閱。
var data = { a: 1 }
// 直接創建一個實例
var vm = new Vue({
data: data
})
alert（vm.a） // => 1
alert(vm.$data === data） // => true
0.創建一個 Vue 實例時，可傳入一個選項數據對象data、props、propsData、computed、methods、watch
選項DOM對象：el、template、render、renderError
選項 / 生命週期鉤子：beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、activated、deactivated、beforeDestroy、destroy、errorCaptured
選項 / 資源directives、filters、components
選項 / 組合parent、mixins、extends、provide / inject
選項 / 其它name、delimiters、functional、model、inheritAttrs、comments
1.Vue 實例的數據對象（請注意是對象），被遞歸轉成getter/setter才能響應數據變化；
2.只能 (含有零個或多個的 key/value 對)；
3.實例 var vm =new Vue({})創建後，可用vm.$data 訪問原始數據對象
4.實際上data對象被Vue代理了，vm.data對象屬性名 = vm.$data.對象屬性名
5.長成這樣的屬性，vm.data對象屬性名是取不到值的，已經不被代理，只能用vm.$data._data對象屬性名取值
_message: 'Hello'
$item：'_和$會和 Vue 內置的屬性、API 方法衝突'
6.★當一個組件被定義，data 必須聲明爲返回一個初始數據對象的函數
若依舊爲對象，則會被所有實例共享其引用，唯有每次創建新實例調用data函數，獲取到全新的數據對象才能和其他實例區分
7.當 new Vue ({})沒有 指定關聯的DOM元素，處於“未掛載”狀態，vm.$mount() 可手動地掛載一個未掛載的實例
8.只有當實例被創建時 data 中存在的屬性纔是響應式的，纔會觸發Watch()函數，所以最好設置一些初始值
9.Object.freeze(obj)，這會阻止修改現有的屬性，也意味着響應系統無法再追蹤變化。
10.vm.$el === document.getElementById('元素名')
11.父級組件可以像處理 native DOM 事件一樣通過 v-on 監聽子組件實例的任意事件
//定義一個名爲 button-counter 的新組件
Vue.component('button-counter', {
props: ['title'],
data: function () {
return {
count: 0
}
},
template: '<button v-on:click="count++">You clicked me {{ count }} times.</button>'
})
new Vue({ el: '#components-demo' })
var ComponentA = { /* ... */ }
var ComponentB = { /* ... */ }
new Vue({
el: '#app',
components: {
'component-a': ComponentA,
'component-b': ComponentB
}
})
//局部註冊的組件在子組件不可用，唯有此可用
var ComponentB = {
components: {
'component-a': ComponentA
},
// ...
}
0.可複用，要名字，el不一樣
1.el提供一個在頁面上已存在的 DOM 元素作爲 Vue 實例的掛載目標(CSS元素/HTML元素)，可用vm.$el取值
2.如果data不是函數，則data對象的數據會被所有實例訪問，存在被修改的風險，如果是函數則每用一次組件，就會有一個它的新實例被創建
3.不管是全局註冊還是局部註冊，都是通過Vue.component註冊的
4.問題在於怎麼區別 全局和局部註冊，直接註冊是使用 Vue.component
5.全局註冊的組件可以用在其被註冊之後的任何 (通過 new Vue) 新創建的 Vue 根實例，也包括其組件樹中的所有子組件的模板中。
6.組件名 使用 短橫線分隔命名 或者 首字母大寫命名（最後使用短橫線，直接在DOM (即非字符串的模板) 中使用時只有 kebab-case 是有效的）
7.component 爲可用組件的hash表
8.通過 Prop 向子組件傳遞數據，當一個值傳遞給一個 prop 特性的時候，它就變成了那個組件實例的一個屬性
9.一個組件默認可以擁有任意數量的 prop，任何值都可以傳遞給任何 prop
10.在template裏面 '' 和 ` `用途不同，後者叫做模板字符串 可用來插入多行的html元素
11.props 用於接收父組件的數據，使用v-bind:屬性名字 與其['屬性名']對應爲動態賦值，也可靜態賦值 ‘屬性名’="值"