前端框架御三家之一的 Vue，在 2020 年第四季迎來的第三代版本，代號為 One Piece。雖說已略為上手 2.0 版，決定藉由 HiSKIO 2020 Vue3 專業職人 的課程，來加速自己的熟悉程度。這篇會筆記下 Vue 的關鍵核心 – Component 組件中的 $event, directive & slot 使用。
課程相關資訊
[連結]：https://hiskio.com/courses/286/lectures/22728
本篇範圍：Chapter 7 ( Vue Component 組件 ) ，一共有 12 篇
請注意：本系列文章為個人對應課程的消化吸收後，所整理出來的內容。換言之，並不一定會包含全部的課程內容，也有可能會添加其他資源來說明。
筆記
1. 取得如 click 點擊的 event 相關資訊，可以用如 handleClick($event) 來進行
2. 承上，如果你要順便傳參數到事件的話，那 $event 得是最後一個
3. 要取得 DOM 元素實體，儘量使用 ref 的方法，然後在 setup() 中進行 return
4. 自定義模版語法，像是 app.directive(‘focus’, mount(el){
el.focus()
})，並且可用 v-focus 來讓多頁面作使用
5. 承上，那麼 Vue 2 中的 mixin 方法就可以被取代掉
6. 請記得，mounted 只會在渲染的時候執行一次，如果要綁定跟 v-modal 同步，那需要定義 updated 的部份
7. 樣式一樣，但內容不一樣，可以用 slot 的方式來處理。在父層傳入東西，裡面用 slot 作替換
