1、自定義指令
內置指令：內部提供的，每個指令都有自己各自獨立的功能
自定義指令：自己定義的指令，可以封裝一些dom操作，擴展額外功能
全局注冊-語法
例如，當頁面加載時，讓元素獲得焦點
Vue.directive('指令名',{"insert"(el) {el.focus()}})insert指的是當指令所綁定的元素被添加到頁面中時會自動調用
該代碼寫在main.js文件中
局部組冊-語法
directives: {"指令名": {inserted() {else.foucs()} }}局部注冊的代碼寫在組件內的script中
使用的時候，和其他指令一樣，v-指令名
* 自定義指令-指令的值
語法：在綁定指令時，可以通過“等號”的形式為指令綁定具體的參數值
通過binding.value可以拿到指令值，指令值修改會觸發update函數
Vue.directive('指令名',{insert(el,binding) {//el為綁定的元素，binding.value獲取等號后的值},update(el,binding) {//同樣的邏輯，用于實時更新}* 自定義指令-v-loading封裝
場景：實際開發過程中，發送請求需要時間，在請求的數據未回來時，頁面會處于空白狀態
需求：封裝一個v-loading指令，實現加載中的效果
分析：
1、本質loading效果就是一個蒙層，蓋在盒子上
2、數據請求中，開啟loading狀態，添加蒙層
3、數據請求完畢，關閉loading狀態，移除蒙層
實現：
1、準備一個loading類，通過偽元素定位，設置寬高，實現蒙層
2、開啟關閉loading狀態，本質只需添加移除類即可
3、結合自定義指令的語法進行封裝復用
2、插槽
作用：讓一些組件內部的一些結構支持自定義
分成后備內容插槽，具名插槽
插槽基本語法：
1、組件內需要定制的結構部分，改用<slot></slot>占位
2、使用組件時，<MyDialog></MyDialog>（自定義的組件）標簽內部，傳入結構替換slot
* 插槽-后備內容（默認值）
通過插槽完成了內容的定制，傳什么就顯示什么，但是如果不傳，則是空白
插槽后備內容：封裝組件時，可以為預留的<slot>插槽提供后備內容（默認內容）
語法：在該標簽內，放置內容，作為默認內容
* 插槽-具名插槽
需求：一個組件內有多處結構，需要外部傳入標簽，進行定制
具名插槽語法：
1、多個slot使用name屬性區分名字
2、template配合v-slot:對應屬性值?來分發對應標簽
其中的v-slot可以直接簡寫為#屬性值
* 插槽-作用域插槽
作用域插槽：定義slot插槽的同時，是可以傳值的。給插槽綁定數據，將來使用組件時可以用
基本步驟：
1、給slot標簽，以添加屬性的方式傳值
<slot :id="item.id" msg="測試文本"></slot>2、所有被添加的屬性，都會被收集到一個對象里
3、在template中，通過#插槽名=“obj”接收，默認插槽名為default
3、路由入門
單頁應用程序：SPA-Single Page Application
單頁面應用：所有功能在一個html頁面上實現
單頁面之所以開發效率高，性能好，用戶體驗好，最大原因是頁面按需更新
要按需更新，首先就要明確：訪問路徑和組件的對應關系
訪問路徑和組件的對應關系由路由確定
vue中的路由：路徑和組件之間的映射關系
1、VueRouter
作用：修改地址欄路徑時，切換顯示匹配的組件
說明：Vue官方的一個路由插件，是一個第三方包
VueRouter的使用（5+2）
5個基礎步驟（固定）
1、下載：下載VueRouter模塊到當前工程
2、引入
import VueRouter from 'vue-router'3、安裝注冊
Vue.use(VueRouter)4、創建路由對象
const router=new VueRouter()5、注入，將路由對象注入到new Vue實例中，建立聯系
new Vue({render: h => h(App),router
}).$mount('#app')以上操作都在main.js中完成
2個核心步驟
1、創建需要的組件（views目錄），配置路由規則
例如：
import Find from './views/Find.vue'
import My from './views/My.vue'
const router =new VueRouter({routes: [{path:'/find',component: Find},{path:'/my',component: My}]
})2、配置導航，配置路由出口（路徑匹配的組件顯示的位置）
例如：
<a href="#/find"></a><a href="#/my"></a>利用<router-view></router-view>進行視圖的展示
2、組件存放目錄問題
注意：.vue文件本質無區別
路徑相關的組件，需要放置在views目錄中
組件分類：頁面組件與復用組件
一般頁面組件放置在views目錄中，而復用組件放置在components目錄中
 到 Scalar)
