Elm - Wie HTML-Ereignisse zu verwenden?

Question

Der Elm getting started guide scheint nicht die Standard-Elm HTML Ereignisse zu verwenden, und ich bin nicht sicher, wie sie zu benutzen. Zum Beispiel onBlur:

view model = 
    div [] 
    [ div [] 
     input [ type_ "text", onInput MsgA ] [] 
    , input [ type_ "text", onBlur MsgB ] [] 
    ] 

Dieses im Compiler schlägt fehl, da jetzt zurückkehre ich Typen Html (String -> Msg) auf Linie 3, aber Html (Msg) in Zeile zwei.

Warum sind diese beiden Ereignisse nicht kompatibel? Gibt es eine Möglichkeit, beides gleichzeitig zu benutzen? Darüber hinaus machen die Dokumente nicht klar genug für jemanden wie mich zu verstehen, wie man onBlur verwenden.

Answer 1

onBlur hat eine andere Art Signatur als onInput.

onInput : (String -> msg) -> Attribute msg 

onBlur : msg -> Attribute msg 

Das heißt, was Msg Sie onInput verwenden hat einen einzelnen String-Parameter zu übernehmen. Ebenso kann der Msg, der in onBlur verwendet wird, keinen Parameter nehmen. Wenn Sie MsgA und MsgB der folgenden neu definiert, wäre es kompilieren:

type Msg 
    = MsgA String 
    | MsgB 

bearbeiten

Wenn Sie Ihren Unschärfe-Handler den Zielwert zu akzeptieren, in der Lage sein wollen, können Sie Ihre eigene wie diese rollen :

import Html.Events exposing (on, targetValue) 
import Json.Decode as Json 

onBlurWithTargetValue : (String -> msg) -> Attribute msg 
onBlurWithTargetValue tagger = 
    on "blur" (Json.map tagger targetValue)