How to pass a context variable to a component in csr mode?

[wiseaidev]

I have a service that I want to use inside a component, and I am trying to figure out how to pass this service at the moment of instantiating. So, basically, I want to do something like:

fn main() {
    let context = SuperDuperService::new("super duper secret key")
    yew::Renderer::<App>::new(context).render();
}

and inside the component, something like:

    fn update(&mut self, ctx: &Context<Self>, msg: Self::Message)  -> bool {
        // I want to use `ctx` as `SuperDuperService` defined above.
        match msg {
            Msg::Connect => {
                ctx.connect(
                    "super-duper-service",
                );
            }
        }
   }

However, it raises the following exception:

error[E0061]: this function takes 0 arguments but 1 argument was supplied
  --> src/main.rs:24:5
   |
24 |     yew::Renderer::<Model>::new(context).render();
   |     ^^^^^^^^^^^^^^^^^^^^^^^^^^^ ------- argument of type `SuperDuperService` unexpected

I want to use this context inside the component, but I am not sure how, Is this thing possible?

Edit-1: How to programmatically communicate with this component so that I can access ctx?
Edit-2: I have found something similar In the two_apps example. I will try it out.
Edit-3: I am looking for something similar, like with_context or some.

[wiseaidev]

I found a workaround, I can instantiate the service inside create, and access this field in other functions, like:

    fn create(_ctx: &Context<Self>) -> Self {
        Model {
            service: SuperDuperService::new("super duper secret key")
        }
    }
    fn update(&mut self, ctx: &Context<Self>, msg: Self::Message)  -> bool {
        match msg {
            Msg::Connect => {
                self.service.connect(
                    "super-duper-service",
                );
            }
        }
   }