2

I'm trying to adapt the Elm tutorial to my own little project and I'm running into trouble with the Json.Decoder that I am supplying.

My code looks like this:

type Msg
    = RetrieveComments
    | FetchSucceed String
    | FetchFail Http.Error

update : Msg -> Model -> ( Model, Cmd Msg)
update msg model =
    case msg of
        RetrieveComments ->
            (model, retrieveComments)
        FetchSucceed whatever ->
            (model, Cmd.none)
        FetchFail error ->
            (model, Cmd.none)

retrieveComments : Cmd Msg
retrieveComments =
    let
        url = "/ReactTutorial/comments.json"
    in
        Task.perform FetchFail FetchSucceed (Http.get commentsCollectionDecoder url)

commentsCollectionDecoder : Decode.Decoder (List Comment.Model)
commentsCollectionDecoder =
    Decode.list commentDecoder

commentDecoder : Decode.Decoder Comment.Model
commentDecoder =
    Decode.object2 Comment.Model
        ("author" := Decode.string)
        ("content" := Decode.string)

The model is just a record with two fields, author and content.

The error message I'm getting is this:

The 3rd argument to function `perform` is causing a mismatch.

44|         Task.perform FetchFail FetchSucceed (Http.get commentsCollectionDecoder url)
                                                 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Function `perform` is expecting the 3rd argument to be:

    Task.Task Http.Error String

But it is:

    Task.Task Http.Error (List Comment.Model)
  • possibly related: http://stackoverflow.com/questions/39320948/decode-json-array-with-objects-in-elm –  Sep 22 '16 at 00:04

1 Answers1

2

I think I figured out my problem.

The messages that I'm defining do not have the correct types. The FetchSucceed message should be accepting a (List Comment.Model) rather than a String. Which means the update function's arguments need to reflect and the model will be updated in a different way.

Something like this:

type Msg
    = RetrieveComments
    | FetchSucceed (List Comment.Model)
    | FetchFail Http.Error

update msg model =
    case msg of
        RetrieveComments ->
            (model, retrieveComments)
        FetchSucceed newComments ->
            ({ model | comments = newComments }, Cmd.none)
        FetchFail error ->
            (model, Cmd.none)