CODEWITHSUNDEEP
elmelm-mdl
josdot
josdot

Reputation: 1

elm-mdl: How to push a record from tab X into the model of tab Y and update tab Y view?

I'm using the demo codebase of elm-mdl as a starting point for my elm project. I have a situation where I need to click a button on one tab (e.g. "tab X") and mutate the state of a different tab (e.g. "tab Y").

Every way I've wired it up so far does not work. This seems like an odd case because the parent of all tabs (e.g. Layout) in the demo codebase is "Demo". It seems in my case that the dependency graph become convoluted because the effect would reach across "Demo" children.

How can this be done? I'm running 0.18.0.

https://github.com/debois/elm-mdl/tree/v8/demo

Upvotes: 0

Views: 104

Answers (1)

gabrielperales
gabrielperales

Reputation: 7785

I've done an example playing around with what I've understand from your question.

I think your issue have to be that you are not passing the model through your tabs , so they are not rendering data related to the current state, instead you should be taking data from the initial model which always keeps inmutable.

Starting from the example code you should have this:

view : Model -> Html Msg
view model =
    Tabs.render Mdl
        [ 0 ]
        model.mdl
        [ Tabs.ripple
        , Tabs.onSelectTab SelectTab
        , Tabs.activeTab model.tab
        ]
        [ Tabs.label
            [ Options.center ]
            [ Icon.i "info_outline"
            , Options.span [ css "width" "4px" ] []
            , text "About tabs"
            ]
        , Tabs.label
            [ Options.center ]
            [ Icon.i "code"
            , Options.span [ css "width" "4px" ] []
            , text "Example"
            ]
        ]
        [ case model.tab of
            0 ->
                tab0 model

            _ ->
                defaultTab model
        ]

My working example is here

Upvotes: 0

Related Questions