Elm練習7


このエントリーをはてなブックマークに追加

引き続きElm練習

Elm練習6

Elm練習 archives

今回はSub/Cmd型の基本構造(architecture)


Program型 Cmd/Subバージョン

Cmd/Subバージョンの説明はプログラミング言語Elmの薄い本(サイト)を参照した

コードの基本形はElm tutorial / Structure of Html.Appを参考にした



Cmd/Sub型の基本形


大体下記のようなものは決まった構文が基本形になるっぽい

  • mainにはHtml.App.program関数?を使う
  • program関数の引数はinit, view, update, subscriptionsの4つ
  • program関数の引数の内容を記述するために下記を定義する
    • MODEL
    • VIEW
    • UPDATE
    • SUBSCRIPTIONS


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
import Html exposing (..)
import Html.App
-- MODEL
type alias Model =
someType(ex: String, Int, Boolean etc)
-- for example, Model = String
init : (Model, Cmd Msg)
init =
("Hello", Cmd.none)
-- VIEW
view : Model -> Html Msg
view model =
div []
[text model]
-- UPDATE
update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
case msg of
NoOp ->
(model, Cmd.none)
-- SUBSCRIPTIONS
subscriptions : Model -> Sub Msg
subscriptions model =
Sub.none
-- MAIN
main : Program Never
main =
Html.App.program
{ init = init
, view = view
, update = udate
, subscriptions = subscriptions
}

subscriptionsにはmouseの挙動やキーボード入力イベント、ブラウザのロケーション変化などを入力できるので公式のexampleも見ておくとどんな感じかわかってよさそう

examples/random

examples/http


このエントリーをはてなブックマークに追加