一、 常用指令：v-for,v-if,v-else,v-model
二娜扇、 綁定事件：@事件名 例如：@click
三错沃、 綁定屬性：:屬性名="值"
命名一個dom元素：ref="dom元素名稱"
例如： <input ref="con">
四 自定義指令：把常用的domr操作封裝一起，方便復(fù)用
五雀瓢、 vue綁定class和style:
1.class綁定類
<button
v-for="(item,index) in typeList.tabNav"
@click="changeCon(index)"
:class="{ 'active': index===currentIndex }"
>
{{item}}
</button>
2.style綁定類
<button
v-for="(item,index) in typeList.tabNav"
@click="changeCon(index)"
:style="{ 'background': index===currentIndex?'#f00':'' }"
>
{{item}}
</button>
六枢析、組件通訊
1.組件作用：是一個獨(dú)立的功能單元，包含：html,css,js邏輯部分
2.通訊方式
第一種：父傳子：props
父傳子時刃麸，通常要對數(shù)據(jù)類型做驗(yàn)證
第二種：子傳父：通過派發(fā)自定義事件醒叁，父級接收派發(fā)的事件來實(shí)現(xiàn)
子組件先派發(fā)自定義事件：$emit
例如： this.$emit('childEvent', this.childValue)
父組件監(jiān)聽：@自定義事件
<footerCom :footerCom="num" @childEvent="handleEvent"></footerCom>
第三種：兄弟（即非父子）之間
1)Global Bus:建立一個空的vue做為橋梁，實(shí)現(xiàn)兄弟組件之間的通訊
第一步：創(chuàng)建一個空的vue做為兄弟組件的橋梁
import Vue from 'vue';
//創(chuàng)建一個空的Vue作為兄弟通訊的橋梁
let bus=new Vue();
export default bus;
第二步：在A,B組件分別引入公共的Bus
//引入bus
import Bus from '../public/bus'
第三步：在A組件發(fā)送
Bus.$emit('toSub',this.v)
第四步：在B組件接收（即監(jiān)聽）：用$on來監(jiān)聽兄弟組件傳過來的數(shù)據(jù)
created() {
// bus.$on('要監(jiān)聽的事件',回調(diào)函數(shù))
bus.$on('toSub',(v)=>{
// console.log(v)
this.str=v;
})
}
7
【重點(diǎn)也是難點(diǎn)】 2)vuex：是另一個實(shí)現(xiàn)兄弟之間通訊的方式
泊业， 第一點(diǎn)： vuex介紹： vuex官網(wǎng)：https://vuex.vuejs.org/zh/
vuex 是什么 ：Vuex 是一個專為 Vue.js 應(yīng)用程序開發(fā)的狀態(tài)管理工具把沼。它采用集中式存儲管理應(yīng)用的所有組件的狀態(tài)
vuex適用場景：構(gòu)建一個中大型單頁應(yīng)用
vuex主要用于存儲多個組件共享的數(shù)據(jù)(例如：登錄狀態(tài)，權(quán)限)吁伺，如果數(shù)據(jù)只是某個組件饮睬，則不需要vuex
第二點(diǎn)：如何使用vuex
第一步：npm install vuex --save
第二步： 創(chuàng)建一個store文件夾，在其中創(chuàng)建一個index.js文件 篮奄，并添加如下代碼：
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
第三步：具體使用
1.添加state度暴露出去
//初始要共享的數(shù)據(jù)源捆愁，相當(dāng)于vue組件data中的數(shù)據(jù)
const state={
count:999
}
const store=new Vuex.Store({
state
});
export default store;
2.獲取state
在要獲取的組件中，通過computed計算屬性來獲取到
computed:{
aa() {
return this.$store.state.count
}
}
3.通過actions,mutaitons改變statew
拋出一個問題宦搬？如何在組件中獲取得到共享的數(shù)據(jù)呢牙瓢？？间校？矾克？？憔足？
