Blazor入手教程（五）組件
組件是相當重要的一部分內容。Blazor是一種單頁應用模式，單頁應用裏面萬物皆可爲組件，
一個頁面是一個組件，一段可重用的ui代碼也可以做成一個組件。
Vue中創建組件的方式大概有單文件組件，字符串模板組件等等。
Blazor中創建組件的方式和Vue也差不多且更簡單。一個.razor文件就是一個組件，這點類似於vue的單文件組件。
我們試着創建一個模態框組件嗎，單獨創建一個文件夾來放置組件。
注意：組件名首字母必須大寫。
Index.razor 合法
index.razor. 不合法
_index.razor 合法
調用組件
調用組件時只需要像寫html標籤一樣寫上去就行了，並可以把參數傳遞過去
寫法是不是和vue一毛一樣？
來看一下效果
而且我們可以看到，每次點擊按鈕時，就會調用子組件中的SetParametersAsync方法。
組件參數 [Parameter]
[Parameters]不僅僅可以標記路由參數，而且他還可以標記組件參數。
使用[Parameter]特性標記了的屬性，表示這是一個組件參數，可以和父組件之間進行通信。（和vue中的props是一個意思，沒有標記的只能在組件內部使用,就和vue中的data是一個意思）。
通過@ref獲取子組件引用
獲取子組件的引用有兩步。
1，在代碼裏定一個子組件類型的字段
2，在調用組件的標籤裏面使用@ref 指向第一步定義的字段 （是不是和vue的面的@ref一模一樣）
這樣我們就可以通過modal直接調用子組件裏面的方法
一個簡單的例子
我們使用上面的引用直接修改子組件的屬性看看會有什麼效果
Vs直接告訴我們，不能在外部修改參數。所以這樣式行不通的
子組件修改父組件狀態
模態框一定會有一個關閉的功能，就像下面這樣。點擊關閉，修改模態框的show爲false，這段代碼是在子組件中，但是修改的應該是父組件的狀態，因爲模態框的狀態show往往是由父組件來維護的。
在vue裏面子組件修改父組件狀態一般有兩種常用的方法:
1,使用emit。在子組件裏面修改時使用This.$emit(“update:data”,value),在父組件設置狀態爲model.sync
2,在父組件使用回調函數。
Blazor修改父組件狀態也有對應的兩種
方法一
1，在子組件裏面定義一個事件，
2，在父組件裏面使用組件是設置事件的回調函數
3，子組件裏面修改時，通過invoke回調函數來實現修改。
這種方法的缺點就是必須在父組件裏面額外定義一個回調函數,並不是一個實用的方法，着重介紹第二種方法。
方法二，使用@bind-參數名
1,在定義子組件show 參數的同時，定義一個 EventCallback<bool> 類型的參數，且該參數的名字約定必須是上面定義名字參數名+Changed。
比如：上面定義了一個參數show，那麼同時定義一個回調參數showChange，名字必須爲showChanged。
2，在子組件內修改狀態時使用 showChange.Invoke(this.show),將狀態通知到父組件。
3，父組件內設置子組件參數時，不在使用原來的show綁定，而使用@bind-show綁定
這種方法的優點就是父組件不需要關心子組件。
。
級聯參數 [CascadingParameter]
級聯參數可以直接將參數注入到孫組件而不通過子組件，級聯參數做一些全局性的設置還是很不錯的。
使用級聯參數步驟：
1，定義父，子，孫三個組件。父組件中使用<CascadingValue Value="msg"></CascadingValue>
標籤包裹子組件，這裏的Value參數就是要向下傳遞的值。
2，父組件中使用子組件，子組件中使用孫組件
3，孫組件中使用[CascadingParameter]標記參數爲級聯參數。
父：
子：
孫：
最終效果：
