YuShu Hsiao

透過 npm 安裝bootstrap 套件 並客製化樣式

1.新增連結、並透過連結(router-link)切換路由

2.製作巢狀路由頁面

3.在component接收動態路由產生的參數(Random User Seeds API)

1.安裝 vue-router 

2.基礎Router 配置及說明

1. Webpack 腳本介紹

2.自定義環境變數

3.安裝axios，並透過axios呼叫API

Vue Cli - 安裝相關套件 以及資料夾結構說明

1.Directive - 頁面初始化後Focuse在某個欄位

2.Directive -判斷E-Mail 輸入格式是否正確

3.Directive - 傳入參數

4.Directive - 取得目前使用Directive的物件所Binding到的變數、以及值

在不同component中，如果有相同的Code，

可以抽出來做Mixin，跟之前的Extend不同的是

Extend 是單一元件做延伸，但Mixin 可以混和多個元件的行為

使用filter針對要顯示的數字做特別處理

使用Extend來有效率的縮短程式碼，

如果不同template內有共同用到的data、filters、mounted等屬性，

可以抽出去做成extend，template在擴充extend之後，自己還是可以額外宣告這些屬性

1.slot 標籤基本用法

2.slot 具名

3.使用 <template> - 不想額外產生標籤

Vue - emit (template內部向外部傳遞事件)

1.props 基礎用法(靜態/動態傳遞資料進入template)

2.維持單向數據流

3.物件延遲載入

4. keep-alive 

5.props 設定型別

1.使用 x-template 來開發元件 寫法一

2.使用 x-template 來開發元件 寫法二

3.在template裡面宣告變數注意事項

1. 使用 Computed 來過濾資料。

2.使用 Computed 來呈現時間格式。

(format javascript timestamp)

3.使用watch 監控變數

1.v-for 合併 標籤template 一起使用

2.Vue.set - 重新渲染物件

3.在component內使用Vue.set (this.$set)

Vue - 多種動態切換ClassName及Style

1. single checkbox / multi checkbox

進階 multi checkbox

2.radio button

3.select 下拉式選單

4.利用 v-for 產生多個image(含後端產生Image路徑)