第三章：
<p v-bind:title = " "></p>
<a v-bind:href = " "></a>
<p :style = "linkCss"></p>
<p :class = "[classA,{classB:hasError}]"></p>
<p v-html = " "></p>
<p v-text = " "></p>
{{ status ? 'success' : 'fail' }}
==>v-for數組和對象的區別：
數組：<li v-for = " (item,index) in items"></li>
對象：<li v-for = " (value,key) in objlist"></li >
組件：<componentA v-for = "(value,key) in objlist" :key="key"></componentA>（通過for
循環傳參給子組件）
==>數組、對象操作方法：
push()
pop()
shift()
unshift()
splice()
sort()
reverse()
以上會觸發dom刷新
filter()
concat()
slice()
this.items[0] = "newValue" ==>使用全局方法Vue.set(this.items,0,newValue)
this.items.length = newLenght
以上不會觸發dom刷新
==>表單：
<select>
<option v-for="item in items" :value = "item.value">{{item.text}}</option>
</select>
v-model的修飾符：（.lazy ：延遲輸出） （.number ：輸出對象轉化為為數字（默認是字符串）） （.trim：去除用戶輸入的空格）
==>計算屬性computed：
<input type="text" v-model="myValue">
{{ myValueWithoutNum }}
export default{
computed:{
myValueWithoutNum :function(){
return this.myValue.replact(/\d/g,'')
}}}
下面這種通過方法類似上面計算屬性的方法，但是二者還是有區別：
{{ myValueWithoutNum() }}
export default{
methods:{
myValueWithoutNum :function(){
return this.myValue.replact(/\d/g,'')
}}}
第四章：
==>動態組件：
<p :is="componenA"></p>
==>父傳子props，可以給傳參類型設置限制：
props可以是數組類型或者對象類型，如果是對象類型，如下寫法，表示可以限制父傳子的傳參類型
props:{
'my-value':[Number,String,Object]
}
==>slot插槽的用法
？？？
vue進階：
==>過渡（Css動畫/JS動畫）
<transition name="fade" mode="out-in"> //mode用于控制動畫展示的過程in-out/out-in
<p v-show="showFlag">i am shower</p> //show
<div :is = "currentView"></div> //動態組件切換
<p v-if="showFlag">i am shower</p> //if
<div v-else>not in show</div> //注意這里的p和div標簽必須不同，如果相同的話，需要添加key屬性以區分，否則不會執行動畫效果。如下：；
<p v-if="showFlag" key="1">i am shower</p> //if
<p v-else key="2">i am shower</p> //if
</transition>
//Css過渡動畫：
//動畫定義時，分四個狀態enter、enter-active、leave、leave-active，在定義樣式的話，沒有設置樣式的狀態，為默認狀態
<style>
.fade-enter-active,fade-leave-active{
transiton:all .5s;
}
.fade-enter,.fade-leave-active{
opacity:0;
}
</style>
//JS過渡動畫：
//這些鉤子函數可以結合CSS transitions/animations 使用，也可以單獨使用。
<transition
v-on:before-enter="beforeEnter"
v-on:enter="enter"
v-on:after-enter="afterEnter"
v-on:enter-cancelled="enterCancelled"
v-on:before-leave="beforeLeave"
v-on:leave="leave"
v-on:after-leave="afterLeave"
v-on:leave-cancelled="leaveCancelled"
//主意：對于僅使用js過渡的元素，記得添加下述一行，Vue會跳過css的檢測，避免了transition標簽在過渡過程中CSS的影響
v-bind:css="false"
>
methods:{
beforeEnter:function(el){
//...
},
//當只用JS過渡的時候，在enter和leave中，回調函數done是必須的。否則，他們會被同步調用，過渡會立即完成。
enter:function(el,done){
//...
done()
}
afterEnter:function(el){
//...
}
........
}
==>Vue項目引入jquery：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>vue</title>
//在這里引入api（Vue在打包的時候，不會對其進行處理）
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.main.js"></script>
</head>
<body>
<div id="app"></div>
</!-- built files will be auto injected -->
</body>
</html>
==>自定義指令
==>mixins（混合）
==>插件
