• 追加された行はこの色です。
• 削除された行はこの色です。
• Elm_guide_Text-Fields へ行く。
• Elm_guide_Text-Fields の差分を削除

#author("2019-11-10T08:00:03+00:00","default:sagasite","sagasite")
#author("2019-11-10T08:05:49+00:00","default:sagasite","sagasite")
[[Program]] ＞ [[JavaScript]] ＞ [[AltJS]] ＞ [[Elm]] ＞ [[Elmガイド>Elm_guide]] ＞ [[Elmアーキテクチャー>Elm_guide_The-Elm-Architecture]] ＞ テキストフィールド

#norelated
#contents

//----------------------------------------
*テキストフィールド [#m53fe32a]
-テキストフィールド · An Introduction to Elm https://guide.elm-lang.jp/architecture/text_fields.html

#code(haskell){{
import Browser
import Html exposing (Html, Attribute, div, input, text)
import Html.Attributes exposing (..)
import Html.Events exposing (onInput)


-- MAIN

main =
  Browser.sandbox { init = init, update = update, view = view }


-- MODEL

type alias Model =
  { content : String
  }


init : Model
init =
  { content = "" }


-- UPDATE

type Msg
  = Change String


update : Msg -> Model -> Model
update msg model =
  case msg of
    Change newContent ->
      { model | content = newContent }


-- VIEW

view : Model -> Html Msg
view model =
  div []
    [ input [ placeholder "Text to reverse", value model.content, onInput Change ] []
    , div [] [ text (String.reverse model.content) ]
    ]
}}

うーん、なんか分かりづらいなー。

文字列を反転させる処理は、どこに入っているんだろう？と思ったけど、
view関数の中に「(String.reverse model.content)」という記述があって、
なんか場所が変じゃね？と思いました。

UPDATEが「状態の更新」なら、そこに置いてある方が自然な感じがすると思うんだけど、どうなんだろ？
今の段階では、あまり深く考え込まないで、Elmガイドを先に読み進めてみます。