This page covers Elm 0.18

Playersコマンド

サーバーからプレーヤーを取得するためのタスクとコマンドを作成する必要があります。 src/Players/Commands.elmを作成します。

module Players.Commands exposing (..)

import Http
import Json.Decode as Decode exposing (field)
import Task
import Players.Models exposing (PlayerId, Player)
import Players.Messages exposing (..)


fetchAll : Cmd Msg
fetchAll =
    Http.get fetchAllUrl collectionDecoder
        |> Http.send OnFetchAll


fetchAllUrl : String
fetchAllUrl =
    "http://localhost:4000/players"


collectionDecoder : Decode.Decoder (List Player)
collectionDecoder =
    Decode.list memberDecoder


memberDecoder : Decode.Decoder Player
memberDecoder =
    Decode.map3 Player
        (field "id" Decode.string)
        (field "name" Decode.string)
        (field "level" Decode.int)

このコードを見てみましょう。

fetchAll : Cmd Msg
fetchAll =
    Http.get fetchAllUrl collectionDecoder
        |> Http.send OnFetchAll

ここでは、アプリケーションを実行するためのコマンドを作成します。

  • Http.getRequestを作成します
  • 次に、このrequestをHttp.sendに送ります。このタスクはコマンドでラップします
collectionDecoder : Decode.Decoder (List Player)
collectionDecoder =
    Decode.list memberDecoder

このデコーダは、リストの各メンバーのデコードを memberDecoderに委譲します

memberDecoder : Decode.Decoder Player
memberDecoder =
    Decode.map3 Player
        (field "id" Decode.string)
        (field "name" Decode.string)
        (field "level" Decode.int)

memberDecoderPlayerレコードを返すJSONデコーダを作成します。


デコーダーの仕組みを理解するために、Elm replを使って遊んでみましょう。

ターミナルで elm replを実行します。 Json.Decoderモジュールをインポートします。

> import Json.Decode exposing (..)

次に、Json文字列を定義します。

> json = "{\"id\":99, \"name\":\"Sam\"}"

また、 idを抽出するデコーダを定義します。

> idDecoder = (field "id" int)

これは、文字列が idキーを抽出してそれを整数としてパースするデコーダを作成します。

このデコーダを実行すると結果が表示されます。

> result = decodeString idDecoder json
OK 99:Result.Result String Int

Ok 99はデコードが成功し、99が得られたことを意味しています。これは(field "id" Decode.int)がやったことであり、単一のキーのデコーダを作成します。

これは方程式の一部です。つぎに2番目の部分をやってみましょう。まず型を定義してください:

> type alias Player = { id: Int, name: String }

Elmでは、レコード型のエイリアス型名を関数として呼び出すことでレコードを作成することができます。たとえば、Player 1 "Sam"はプレーヤーレコードを作成します。パラメータの順序は他の関数と同様に重要であることに注意してください。

次を試してみてください:

> Player 1 "Sam"
{ id = 1, name = "Sam" } : Repl.Player

これらの2つのコンセプトで完全なデコーダを作成しましょう:

> nameDecoder = (field "name" string)
> playerDecoder = map2 Player idDecoder nameDecoder

map2は最初の引数(この場合Player)と2つのデコーダとしての関数をとります。次に、デコーダを実行し、その結果を関数の引数(Player)に渡します。

試してみましょう:

> result = decodeString playerDecoder json
Ok { id = 99, name = "Sam" } : Result.Result String Repl.Player

programにコマンドを送信するまで、実際には実行されません。

results matching ""

    No results matching ""