初始化时的 Elm Http 请求答案

【问题标题】：Elm Http Request on Init初始化时的 Elm Http 请求
【发布时间】：2016-10-10 21:53:39
【问题描述】：

我对 Elm 很陌生，但慢慢熟悉它。我正在做一些简单的 Http 请求，这些请求在各个方面都是成功的（我得到要显示的数据等）

目前我只能让我的 fetchData 触发 onClick，我想在 init 上初始化它，但我无法解决这个问题。

....这是我的 fetchData 函数：

fetchData : Cmd Msg
fetchData =
  Http.get repoInfoListDecoder "http://example/api"
    |> Task.mapError toString
    |> Task.perform ErrorOccurred DataFetched

当前在视图中由 onClick 事件触发：

.....
, button [ onClick FetchData ] [ text "Load Data" ]
.....

我想避免通过按钮请求数据，而是希望在应用初始化时加载数据。这是我的初始化：

init =
  let
    model =
      { message = "Welcome", repos = [] }
  in
    model ! []

还有我的更新（有点被剥夺了……例如，为了）：

update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
  case msg of
    NoOp ->
      model ! []
    ...........
    FetchData ->
      { model | message="hi" } ! [fetchData]
    ...........
    DataFetched repos ->
      { model | repos = repos, message = "The data has been fetched!" } ! []

这有意义吗？我只是在应用加载时难以初始化 fetchData，所以我可以显示我的数据而无需点击按钮来获取它。

提前致谢！

【问题讨论】：

标签： elm

【解决方案1】：

当您使用Html.program 时，您的init 函数会返回要执行的模型和命令的初始数据。

命令是副作用，例如 HTTP 请求。

尝试更改init，使其立即运行命令：

init: (Model, Cmd Msg)
init =
  let
    model =
      { message = "Welcome", repos = [] }
  in
    model ! [ fetchData ]

【讨论】：

【解决方案2】：

这是Html.App.program 的类型签名。 init 接受 Cmd，您只需在此处提供您的 Cmd。

program
    :  { init : (model, Cmd msg), update : msg -> model -> (model, Cmd msg), subscriptions : model -> Sub msg, view : model -> Html msg }
    -> Program Never

【讨论】：

【解决方案3】：

另一种方法是使用Task，尚未提及。您可以尝试类似

initWithFlags : Flags -> ( Model, Cmd Msg)
initWithFlags flags =
    ( { user = flags.user }, (Task.perform fetchData) )

【讨论】：