Posted at

ElmでWebAPIから受け取ったオブジェクト配列のレスポンスをRecordにマッピングする

たとえば以下のような JSON が WebAPI からレスポンスとして返ってくることを想定する

[

{
"name": "juestine",
"age": 21
},
{
"name": "alice",
"age": 23
}
]

このレスポンスを以下の Person レコードにマッピングするにはこのような実装にする。

fetchPeople を呼ぶと WebAPI へのフェッチが走る。

import Json.Decode as Decode exposing (field, string, int)

-- 省略...

type Msg =
| PeopleFetched (Result Http.Error (List Person))

-- 省略...

type alias Person =
{
name: String
age: Int
}

fetchPeople : Cmd Msg
fetchPeople =
Http.get {
url = "http://your-own-web-api/users",
expect = Http.expectJson PeopleFetched peopleFetchingDecoder
}

personDecoder : Decode.Decoder Person
personDecoder =
Decode.map2 Person
(field "name" string)
(field "age" int)

peopleFetchingDecoder : Decode.Decoder (List Person)
peopleFetchingDecoder =
Decode.list personDecoder

あとは PeopleFetched で受け取れる Result 型のメッセージを煮るなり焼くなり好きにする。