Question

我有一个Elm SPA，其页面包含图表。我正在使用JS端口来激活chart.js图表。加载页面时，我想通过端口发送图表数据。我能够在事件上很好地连接命令（例如，选择更改），但是如果在加载页面时如何获取命令，我将感到茫然。

我尝试在我的应用程序的init中连接命令，但当然在我检索应用程序数据之前会触发该命令。

非常感谢！

一些示例代码：（我正在创建带有“图表”的Cmd，其中是我的端口的名称，它根据我的模型获取图表数据。）

Main.elm

init : Result String Route -> ( Model, Cmd Msg )
init result =
    let
        currentRoute =
            Routing.routeFromResult result
    in
        ( initialModel currentRoute, Cmd.map VendorsMsg fetchAll )


subscriptions : Model -> Sub Msg
subscriptions model =
    Sub.none


urlUpdate : Result String Route -> Model -> ( Model, Cmd Msg )
urlUpdate result model =
    let
        currentRoute =
            Routing.routeFromResult result
    in
        ( { model | route = currentRoute }, chart (computeChartData model) )


main : Program Never
main =
    Navigation.program Routing.parser
        { init = init
        , view = view
        , update = update
        , urlUpdate = urlUpdate
        , subscriptions = subscriptions
        }

Routing.elm

type Route
    = HomeRoute
    | AdminRoute
    | EditVendorRoute VendorId
    | NotFoundRoute


matchers : Parser (Route -> a) a
matchers =
    oneOf
        [ format HomeRoute (s "")
        , format EditVendorRoute (s "admin" </> int)
        , format AdminRoute (s "admin")
        ]


hashParser : Navigation.Location -> Result String Route
hashParser location =
    location.hash
        |> String.dropLeft 1
        |> parse identity matchers


parser : Navigation.Parser (Result String Route)
parser =
    Navigation.makeParser hashParser


routeFromResult : Result String Route -> Route
routeFromResult result =
    case result of
        Ok route ->
            route

        Err string ->
            NotFoundRoute

Answer 1

鉴于您的初始型号，您应该能够在chart功能期间触发init端口：

init : Result String Route -> ( Model, Cmd Msg )
init result =
    let
        currentRoute =
            Routing.routeFromResult result
        model =
            initialModel currentRoute
    in
        ( model, Cmd.batch [ Cmd.map VendorsMsg fetchAll, chart (computeChartData model) ] )

即使您手动将URL输入浏览器，也应确保触发端口。

Answer 2

您可以使用标志在页面加载时将初始数据传递给您的程序。因此，如果您担心在页面加载时需要初始数据，只需将其传递给榆树代码。

在Elm中，如果页面被路由到，我该如何触发Cmd？

2 个答案: