Как добавить дополнительные HTML-элементы в код elm? - PullRequest
Новая
       21

Как добавить дополнительные HTML-элементы в код elm?

0 голосов
/ 31 января 2019

Я пытаюсь реализовать дополнительные элементы HTML, такие как title (h1) или img src.Я использовал подход в моем коде с h1, который, к сожалению, не работает.Кнопки и входные данные, которые я нашел в документации, но я не совсем понимаю (также из других руководств), как реализовать другие элементы. 

-- VIEW


view : Model -> Html Msg
view model =
  div []
    [ h1 [] [ text "todos" ]
    ]
    [ div[] [ input [ placeholder  "? Team 1", style "width" "300px", style "height" "30px", style "font-size" "25px", style "color"  "#488aff", value model.content] []
    , input [ placeholder  "?? Strength", style "width" "300px", style "height" "30px", style "font-size" "25px", style "color"  "#32db64", value model.content ] []
    ]
    , div []
  [ button [ style "background-color" "#66cc81", style "color" "white", style "margin-top" "20px", style "width" "610px", style "border-radius" "25px", style "height" "60px", style "font-size" "30px", style "margin-right" "70px"] [ text "+ADD" ]
    ]
    ]

также эта версия не работает: 

view : Model -> Html Msg
view model =
  div []
    [ div [h1 [] [ text "todos" ]
    ]
    ,div[] [ input [ placeholder  "? Team 1", style "width" "300px", style "height" "30px", style "font-size" "25px", style "color"  "#488aff", value model.content] []
    , input [ placeholder  "?? Strength", style "width" "300px", style "height" "30px", style "font-size" "25px", style "color"  "#32db64", value model.content ] []
    ]
    , div []
  [ button [ style "background-color" "#66cc81", style "color" "white", style "margin-top" "20px", style "width" "610px", style "border-radius" "25px", style "height" "60px", style "font-size" "30px", style "margin-right" "70px"] [ text "+ADD" ]
    ]
    ]

1 Ответ

0 голосов
/ 31 января 2019

В вашем коде много случайных скобок.Я переформатировал его, чтобы получить следующее: 

view : Model -> Html Msg
view model =
  div []
    [ h1 [] [ text "todos" ]
    , div[] [ input [ placeholder  "? Team 1", style "width" "300px", style "height" "30px", style "font-size" "25px", style "color"  "#488aff", value model.content] [] ]
    , input [ placeholder  "?? Strength", style "width" "300px", style "height" "30px", style "font-size" "25px", style "color"  "#32db64", value model.content ] []
    , div [] [ button [ style "background-color" "#66cc81", style "color" "white", style "margin-top" "20px", style "width" "610px", style "border-radius" "25px", style "height" "60px", style "font-size" "30px", style "margin-right" "70px"] [ text "+ADD" ] ]
    ]

Вот diff вашей версии и моей.

Функция div принимает два аргумента:Список атрибутов и список элементов.Обратите внимание, что в моей версии выше были удалены некоторые случайные скобки, которые вызывали сбои компиляции.

...