指定路由而不是路径的Elm路由

我对Elm很陌生，刚刚看过Elm教程应用程序

我想知道，当我点击一个指定路线而不是路径的链接时，我如何改变页面

这是路线

type Route
    = HomeRoute
    | NotFoundRoute

matchers : Parser (Route -> a) a
matchers =
    oneOf
        [ map HomeRoute top ]

parseLocation : Location -> Route
parseLocation location =
    case (parsePath matchers location) of
        Just route ->
            route

        Nothing ->
            NotFoundRoute

现在在视图中，我想在单击菜单链接时选择HomeRoute

menuItems : List MenuItem
menuItems =
  [ { text = "Dashboard", iconName = "dashboard", route = HomeRoute }
  ]


viewDrawerMenuItem : Model -> MenuItem -> Html Msg
viewDrawerMenuItem model menuItem =
  Layout.link
    [ Layout.onClick (NavigateTo menuItem.route)
    , (Color.background <| Color.color Color.BlueGrey Color.S600) when (model.route == menuItem.route)
    , Options.css "color" "rgba(255, 255, 255, 0.56)"
    , Options.css "font-weight" "500"
    ]
    [ Icon.view menuItem.iconName
        [ Color.text <| Color.color Color.BlueGrey Color.S500
        , Options.css "margin-right" "32px"
        ]
    , text menuItem.text
    ]

我可以创建一个更新NavigateTo，将路由作为字符串，然后让Navigation创建一个新的Url。像

NavigateTo path ->
            (model, Navigation.newUrl path)

---

但我宁愿使用联合类型路由，而不是使用路径作为字符串。

在任何情况下，您都需要一个将路由转换为字符串的函数：

pageToString : Route -> String
pageToString route =
    case page of
        HomeRoute -> "home"
        AboutRoute -> "about"
        ContactRoute -> "contact"
        LoginRoute -> "login"
        DashboardRoute -> "dashboard"
        NotFoundRoute -> "404"

然后你可以做一些类似的事情：

NavigateTo : Route -> (Model, Cmd a)
NavigateTo route ->
            (model, (Navigation.newUrl <| pageToString route))

NavigateTo:Route->（型号，Cmd a）
导航到路线->
（model，（Navigation.newUrl在任何情况下，您都需要一个将路由转换为字符串的函数：

pageToString : Route -> String
pageToString route =
    case page of
        HomeRoute -> "home"
        AboutRoute -> "about"
        ContactRoute -> "contact"
        LoginRoute -> "login"
        DashboardRoute -> "dashboard"
        NotFoundRoute -> "404"

然后你可以做一些类似的事情：

NavigateTo : Route -> (Model, Cmd a)
NavigateTo route ->
            (model, (Navigation.newUrl <| pageToString route))

NavigateTo:Route->（型号，Cmd a）
导航到路线->
（model），（Navigation.newUrl您可能不想按原样走
Hop
路线。
Navigation
已经说明了当前应该如何做

添加到不同的注释中，可能更明智的做法是在
列表字符串上执行
字符串。因为您可以构建一个
解析器
，该解析器可以处理多个斜杠

reverse : Route -> String
reverse route =
    String.join "/" 
        << (::) ""
    <| case route of
          Index ->
              [ "" ]

          Foo ->
              [ "foo" ]

          FizzBuzz x ->
              [ "fizz", "buzz", x ]

reverse:Route->String
反向路线=
String.join“/”
[“foo”]
嘶嘶嗡嗡声x->
[“嘶嘶”，“嗡嗡”，x]

（我将此作为一个评论，但StackOverflow有那个愚蠢的声誉限制）
您可能不想沿着
跳跃
路线走下去。
导航
已经说明了当前应该如何做

添加到不同的注释中，可能更明智的做法是在
列表字符串上执行
字符串。因为您可以构建一个
解析器
，该解析器可以处理多个斜杠

reverse : Route -> String
reverse route =
    String.join "/" 
        << (::) ""
    <| case route of
          Index ->
              [ "" ]

          Foo ->
              [ "foo" ]

          FizzBuzz x ->
              [ "fizz", "buzz", x ]

reverse:Route->String
反向路线=
String.join“/”
[“foo”]
嘶嘶嗡嗡声x->
[“嘶嘶”，“嗡嗡”，x]

（我将此作为一个评论，但StackOverflow有那个愚蠢的声誉限制）
非常感谢。它确实有意义，并且像那样工作得很好。非常感谢。它确实有意义，并且像那样工作得很好。