vue是一套用於構建使用者介面的漸進式框架。與其它大型框架不同的是，vue 被設計為可以自底向上逐層應用。vue 的核心庫只關注檢視層，不僅易於上手，還便於與第三方庫或既有專案整合。另一方面，當與現代化的工具鏈以及各種支援類庫結合使用時，vue 也完全能夠為複雜的單頁應用提供驅動。
mvvm：雙向資料繫結 mv vm 無需關注 dom操作（無需關注檢視），只需要關注資料即可
元件化：元件 頁面上的 公共小單元（如 網頁頭部 商品卡片）
首先用script標籤引入vue.js
let vm = new vue(
}) vue mvvm原理
利用es5 defineproperty()
攔截 資料的設定和獲取，動態的改變檢視
} 模板 插值 展示 vue 狀態（可以是乙個資料也可以是乙個函式返回資料）
} 可以寫 簡單的js表示式 （加減乘除 三目 短路）
注意：1，不能寫語句
var a=10;
a+b2，能不能流程控制 不能寫流程控制 只能寫三目 或者短路
3,模板中 js全域性變數有些可以使用有些不可以使用（vue有乙個白名單）
let vm = new vue(
})vm.$mount(document.queryselector("#box"));
vue 擴充套件了 標籤屬性的功能，賦予它一些特殊的功能
語法： v-指令名字
使用方法：同標籤的屬性
v-model 將表單的值 與 data中的狀態 進行 雙向繫結
v-text 將元素的內容 與data狀態進行雙向繫結
v-html 將內容解析成 html （慎重使用，一般後台返回富文字內容時使用）
v-bind:屬性 擴充套件了是任意屬性（可以包括自定義屬性，也可以是標籤預設的屬性）
幹了什麼事：
將屬性的值 變成動態的值，和 vue的data中的state進行繫結
簡寫： :屬性
v-on:事件
將元素的事件 與 methods中的方法進行繫結（方法變成事件函式）
事件呼叫時 全域性變數 $event 儲存了事件物件
簡寫： @事件
注意：vue
v-on:事件="這裡不適合寫過多的業務邏輯**"
}原因：
只能使用一些簡單的表示式，不能寫語句，不能使用 邏輯控制語句，很多js全域性變數也不能使用（白名單裡面的才能用）
檢視 中一般只簡單的展示資料，呼叫命令，不適合 寫過多的業務邏輯**，否則會造成，**混亂（高耦合）
修飾符是由點開頭的指令字尾來表示的。賦予了事件一些特殊的功能 addeventlistener("事件名",函式,true/false)
.stop 阻止事件冒泡
.prevent 阻止預設事件
.capture 在捕獲階段觸發
.self 只能通過元素本身觸發，後代元素無法觸發
.oncvuee 只觸發一次
一切以資料為核心 不要去操作dom
v-if
v-else-if
v-else
v-show
v-if和v-show的區別以及使用場景？
1，當元素消失時不出來時。v-show 是display:none v-if直接dom移除節點
都有啥使用場景：
場景1： **塊 **很多，預設是不顯示的，後面有條件的顯示 v-if
首次載入 惰性的
v-if 有更高的切換開銷，而 v-show 有更高的初始渲染開銷。
元件化：元件可以理解為 網頁上 獨立的乙個部分 （如網頁頭部）
vue: 元件也是vue例項 （例項的屬性 元件都有）
如何定義乙個元件
let commonheader =
},methods:
}如何區分全域性元件和區域性元件？ 在vue上註冊的就是全域性元件 在某個元件或者例項中註冊的就是區域性元件
全域性元件
在任意的元件和例項上使用
vue.component("元件名",
},methods:
})區域性元件 只能在註冊的元件或者例項上使用
注意：1，元件中的data 必須是 乙個函式 返回乙個物件
2，每個元件有自己的作用域，元件內部的資料，和方法只能在元件內部使用（如向跨元件，需要元件間通訊）
3，元件的命名 可以有兩種 1大駝峰 2下劃線命名法
eg:commonhead common-head
使用時二者都一樣
4，區域性元件 在哪個元件的components中註冊，就只能在這個元件的template中使用
5，元件的template 有且只能有乙個根標籤（元素）
1，簡單用法
在子元件中 定義props屬性 值是乙個陣列 陣列中 每個元素，就是 從父元件接收的 資料
子元件let commonhead=
在父元件中 使用 子元件 的自定義標籤中 通過 屬性的形式 傳入 父元件的資料
父元件let home =
},components:
}2，props驗證
上面的props用法，沒有校驗 props資料型別，以及必須填寫，預設值 等，會造成 程式 存在 不穩定性 （**不健壯）
驗證主要驗證三個型別：
資料型別
string
number
boolean
array
object
date
function
symbol
必須填寫
required:true/false 如果為false 就別寫了
預設值：
default
注意：props 不再是陣列 而是物件
props:,c:}
注意：1，當 乙個陣列 型別為 資料的時候 傳資料時，不能直接靜態傳乙個資料（傳的是字串）
2，資料型別為 array，或者object 預設值 必須是乙個 函式 返回乙個預設值
3，props 能在子元件中 直接改變值嗎？ 不能（單向資料流）
在子元件中 通過
名字 child元件
this.$emit("事件名",攜帶的資料)
父元件 parent中使用}}
原理：利用乙個第三方的 元件 進行彈射事件，且 進行接收事件
let bus = new vue();
彈射：bus.$emit("事件名字",攜帶的引數)
監聽事件：
bus.$on(事件名,**函式)
Vue筆記二 Vue基本語法及指令
new vue 方法用於建立乙個vue例項 乙個vue應用由至少乙個vue例項作為根元件 以及可選的多個巢狀元件組成 vue 使用基於html的模板語法 當然也可以不用模板直接寫渲染 render 函式使用jsx語法，此處不做討論 文字插值 在html文字中標記可能發生變化的位置的 語法 musta...
vue常用指令和標籤
5 v if v show 6 在 vm 例項中，如果要訪問 data 上的資料，或者要訪問 methods 中的方法，必須帶 this 7常見標籤 v text會覆蓋元素中原本的內容，但是 v cloak 插值表示式 只會替換自己的這個佔位符，不會把 整個元素的內容清空 v html是以html的...
vue基本指令
指令是一些特殊的標記，給html新增一些原來沒有的功能 指令一 v model type text v model num type checkbox v model ischecked div const vm newvue 雙向資料繫結的原理底層通過 object.defineproperty ...