CODEWITHSUNDEEP
url-routingmithril.js
tmp dev
tmp dev

Reputation: 9193

how to perform mithril routing with children (subcomponents)

I am writing an application using mithril and react. I need to define the routes, and so far this is what I have come up with

m.route(root, '/', {
    '/': LoginComponent,
    '/login': LoginComponent,
    '/Login/Email': LoginEmailComponent,
    '/Login/Password': LoginPasswordComponent,
})

The idea is that LoginComponent is a parent with two childroutes (email and password). I have some common stuff in LoginComponent which are common to both email and password component, hence I want them rendered inside LoginComponent. How do I do this through Mithril? Or do I need to use something like the react-router to get this done?

Upvotes: 2

Views: 927

Answers (1)

Tivac
Tivac

Reputation: 2573

https://mithril.js.org/route.html#wrapping-a-layout-component describes how to accomplish what you're trying to do.

m.route(root, '/', {
    '/': LoginComponent,
    '/login': LoginComponent,
    '/Login/Email': {
        render() {
            return m(LoginComponent, m(LoginEmailComponent));
        }
    },
    '/Login/Password': {
        render() {
            return m(LoginComponent, m(LoginPasswordComponent));
        }
    },
})

Mithril's router doesn't have an explicit idea of child routes like react-router does, but a RouteResolver + Layout Component can replicate some of the behavior.

Upvotes: 2

Related Questions