Function dioxus_hooks::use_coroutine
source · pub fn use_coroutine<M, G, F>(cx: &ScopeState, init: G) -> &Coroutine<M>where
M: 'static,
G: FnOnce(UnboundedReceiver<M>) -> F,
F: Future<Output = ()> + 'static,
Expand description
Maintain a handle over a future that can be paused, resumed, and canceled.
This is an upgraded form of [use_future
] with an integrated channel system.
Specifically, the coroutine generated here comes with an [UnboundedChannel
]
built into it - saving you the hassle of building your own.
Addititionally, coroutines are automatically injected as shared contexts, so downstream components can tap into a coroutine’s channel and send messages into a singular async event loop.
This makes it effective for apps that need to interact with an event loop or some asynchronous code without thinking too hard about state.
Global State
Typically, writing apps that handle concurrency properly can be difficult, so the intention of this hook is to make it easy to join and poll async tasks concurrently in a centralized place. You’ll find that you can have much better control over your app’s state if you centralize your async actions, even under the same concurrent context. This makes it easier to prevent undeseriable states in your UI while various async tasks are already running.
This hook is especially powerful when combined with Fermi. We can store important global data in a coroutine, and then access display-level values from the rest of our app through atoms.
UseCallback instead
However, you must plan out your own concurrency and synchronization. If you
don’t care about actions in your app being synchronized, you can use [use_callback
]
hook to spawn multiple tasks and run them concurrently.
Notice
In order to use rx.next().await
, you will need to extend the Stream
trait (used by UnboundedReceiver
)
by adding the futures-util
crate as a dependency and adding StreamExt
into scope via use futures_util::stream::StreamExt;
Example
enum Action {
Start,
Stop,
}
let chat_client = use_coroutine(cx, |mut rx: UnboundedReceiver<Action>| async move {
while let Some(action) = rx.next().await {
match action {
Action::Start => {}
Action::Stop => {},
}
}
});
cx.render(rsx!{
button {
onclick: move |_| chat_client.send(Action::Start),
"Start Chat Service"
}
})