Elm 架構

本章將討論在 Elm 平臺上建立應用程式的標準方法。Elm 使用類似於模型-檢視-控制器 (MVC) 模式的架構模式。

以下是 Elm 架構的四個主要部分。

• 模型 (Model)
• 檢視 (View)
• 訊息 (Message)
• 更新 (Update)

Elm 架構如何工作

模型包含應用程式狀態。例如，如果一個應用程式顯示客戶列表，則狀態將包含每個客戶的資料。為了以可呈現的方式顯示狀態，必須生成一個檢視/html。一旦使用者透過按下按鈕或在表單中鍵入資料來與檢視互動，檢視就會生成稱為訊息的訊號。訊息被傳遞到更新方法，該方法評估訊息並採取適當的操作。因此，更新方法將生成一個新的模型。

新的模型生成一個新的檢視。檢視將導致使用者產生新的互動來發出訊息，這些訊息將傳遞到更新函式。此外，該函式建立一個新的模型。因此，迴圈重複，如上圖所示。

模型 (Model)

模型處理應用程式的狀態。定義模型的語法如下：

-- Model syntax

type alias Model = {
   property1:datatype,
   proptery2:datatype
...
}

要建立一個模型，我們首先需要建立一個包含所有所需屬性的模板。每個屬性都指定應用程式的狀態。

檢視 (View)

檢視是應用程式狀態的視覺化表示。檢視知道如何獲取資料並從中生成網頁。當用戶與檢視互動時，使用者可以透過生成訊息來操作狀態。定義檢視的語法如下：

--View Syntax
view model =some_implementation

訊息 (Message)

訊息是使用者更改應用程式狀態的請求。訊息作為引數傳遞給更新函式。

--Message Syntax
type Message = Message1 |Message2 ...

語法顯示了一個 Message 型別。Elm 應用程式將根據傳遞給它的訊息來編輯狀態。這些決策是在更新方法中做出的。

更新 (Update)

更新函式解釋作為引數傳遞給它的訊息，並更新模型。

--Update Syntax
update Message_type model =
   some_implementation

更新函式將訊息和模型作為引數。