Question

我在使用Elm的浏览器中导航时遇到问题。当我导航到某个闪烁的特定页面 / thing / sufflist 时，发生错误，然后将我转移到路径 / home 。使用浏览器的后退按钮，我可以访问 / thing / stufflist 页面，而不会出现任何问题。

/ thing 是关于事物的主页，然后在 / thing / xxx

中具有选项卡的对等项

我在Elm导航中设置了以下路由：

        case routePath of
            DefaultRoute ->
                notFoundPage model

            HomeRoute ->
                homePage model

            ...

            ThingTab id page ->
                case String.toInt id of
                    Ok thingId ->
                        ThingMain.page thingId model page

                    Err error ->
                        ThingMain.page 0 model page

            NotFoundRoute ->
                notFoundPage model

ThingMain.page是

page : Int -> Model -> String -> Html Msg
page thingId model page =

    let
        maybeThing =
            model.thingList
                |> List.filter (\thing -> thing.id == thingId)
                |> List.head
    in
        case maybeThing of
            Just thing ->
                    case page of
                        "info" ->
                            thingView thing (thingInfoView thing)

                        "stuffs" ->
                            let
                                stuffs =
                                    model.stuffList
                                    |> List.filter (\stuff -> stuff.ting.id == thingId)
                            in
                                thingView thing (stuffsView stuffs)

                        _ -> 
                            Error.notFoundPage model

            Nothing ->
                Error.notFoundPage model

这个suffsView：

stuffsView : List Stuff.Stuff -> Html Msg
stuffsView stuffs =
    div [class "dialog-large"][
        div [class "list"][
            renderStuffList stuffs
        ]
    ]

使用此方法呈现列表：

renderStuffList : List Stuff.Stuff -> Html Msg
renderStuffList stuffs =
    if List.isEmpty stuffs then
        text "No stuff"
    else 
        stuffs 
            |> List.map ( \stuff -> listStuff stuff )
            |> ol [ class "stuff-list" ]

并被馈入此通用页面方法：

thingView : Thing.Thing -> Html Msg -> Html Msg
thingView thing tabContent =
     div [class "mr-main flex-column flex-start"][
        h4 [][ text (thing.name) ]
        , tabContent        
        ,div [class "dialog-large split-choice"][
            button [class "input", onClick (Msg.Navigate("thing/" ++ toString thing.id )) ][
            text ("Info")
            ]
            ,button [class "input", onClick (Msg.PostAndNavigate (stuffListRequest thing.id)) ][
            text ("Stuffs")
            ]
        ]
        ,div [class "dialog-large split-choice"][
            button [class "input half-width", onClick ( Msg.Navigate("home") ) ][ 
                text ("Home") 
            ]
        ]
    ]

在所有情况下都可以正常工作，除非它获得带有空列表的填充列表标签。如前所述，我什至可以浏览并查看我的“无资料”页面。

在我看来，这一切似乎都很（神奇），我不知道在哪里看？

Answer 1

此代码没有错。我怀疑这是我自己的错。

当我导航到 / thing / stufflist 时，我执行一个get（ish）请求以同步数据时，我的逻辑存在人为错误。原来，如果列表中没有任何内容，我没有得到。

榆木导航导航后跳转

1 个答案: