#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ガイドを先に読み進めてみます。

トップ   編集 差分 履歴 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS