Borrowing from `self` in routes

[Boscop]

I was reading the yew-router guide yesterday, which has this code: https://github.com/yewstack/yew_router/blob/master/examples/guide/chapters/02_router_component.md#example

html! {
    <Router>
        <Route matcher=route!("/b")> 
            <BModel/>
        </Route>
...

Presumably, state passed as attributes to BModel could borrow from self at the time the guide was written (like <BModel foo=&self.bar />). But this example (and others from the guide) don't compile anymore..

I'd really like to have this back, because currently it's very inconvenient.
Also with functions mapped over iterators that should be rendered (like
{ for self.foos.iter().map(render_foo) }), currently they can't borrow from self anymore either..

[drdozer]

I think I've hit this. I have a stateful top-level component that tracks, among other things, the current user. The login sub-component needs a callback so that the top-level can update its user on login. However, I can't find any way to implement this because it introduces a reference to self in the render property.

let on_login = self.on_login.clone();

html! {
<Router<AppRoute>
  render = Router::render(|switch: AppRoute| {
    match switch {
       AppRoute::Login => html! { <login_form::LoginForm on_login=on_login /> },
...

It complains that render needs an Fn but the value I've given it is an FnOnce because it captures on_login from the environment. I can't find any variant on this that works. Moving self in causes a clash with the static lifetime requirement.

Unless I've completely misunderstood, the lifetime of the vdom made by rendering self should be no longer than the lifetime of self itself. So 'static seems overly cautions. But perhaps I've misunderstood.

[drdozer]

FYI I found a combination that appears to work:

let on_login = self.on_login.clone();

html! {
<Router<AppRoute>
  render = Router::render(move |switch: AppRoute| {
    match switch {
       AppRoute::Login => html! { <login_form::LoginForm on_login=on_login.clone() /> },
...

We must clone the on_login callback into a local var. Just holding it by reference or value doesn't work. We must use move for the closure to move on_login in. We must then clone it again when assigning to the property. That ensures that the copy moved into the closure is not "used up", so the closure can be called repeatedly.

[teymour-aldridge]

That seems to do the trick!