Question

我对榆树很新，但慢慢熟悉它。我正在做一些简单的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 ! []

我的更新（有点被剥离......例如sakes）：

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时遇到困难，所以我可以显示我的数据而无需点击按钮来获取它。

提前致谢！

Answer 1

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

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

尝试更改init，以便它立即运行命令：

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

Answer 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

Answer 3

另一种方法是使用尚未提及的Task。你可以试试像

这样的东西

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

关于Init

3 个答案: