サルでもわかるWEBプログラミング

フリーソフトのみでホームページ作成

現在位置: index.html » elm » elm-chat

トレース:

elm:elm-chat

差分

このページの2つのバージョン間の差分を表示します。

この比較画面へのリンク

--- elm:elm-chat [2019/06/16] – [linuss/smooth-scrollパッケージ] adash333
+++ elm:elm-chat [2019/06/16] (現在) – [elmでchatアプリ] adash333
@@ 行 1: / 行 1: @@
 ====== elmでchatアプリ ======
+http://i-doctor.sakura.ne.jp/font/?p=38884
+ElmとFirebaseでチャットアプリを写経してみる（２）複数ファイルを1個のファイルにする
+年6月16日
+ソースコード
+（index.htmlの55行目のFirebaseのアドレスはご自身のものを入力してください。）
+https://github.com/adash333/elm-firebase-chat2
+DEMOサイト
+https://romantic-noyce-862b75.netlify.com/
@@ 行 90: / 行 100: @@
 </code>
+  *update msg modelに以下を追加
+<code>
+update msg model =
+    case msg of
+        NoOp ->
+            ( model, Cmd.none )
+        SmoothScroll id ->
+            ( model, Task.attempt (always NoOp) (scrollTo id) )
+</code>
+  *VIEWに以下を追加
 <code>
-type Msg
+view model =
-    = NoOp
+    { title = "Foo"
-    | SmoothScroll String
+    , body =
+        [ div []
+            [ p
+                [ id "p-one"
+                , onClick (SmoothScroll "p-two")
+                ]
+                [ text "p one" ]
+            , div [ style "margin-top" "500px"][ text "555555" ]
+            , p
+                [ id "p-two"
+                , style "margin-top" "1500px"
+                , onClick (SmoothScroll "p-one")
+                ]
+                [ text "p two" ]
+            ]
+        ]
+    }
 </code>

elm/elm-chat.1560675271.txt.gz · 最終更新: 2019/06/16 by adash333