Working with External State
This guide will help you integrate your Dioxus application with some external state like a different thread or a websocket connection.
Working with non-reactive State
Coroutines are great tool for dealing with non-reactive (state you don't render directly) state within your application.
You can store your state inside the coroutine async block and communicate with the coroutine with messages from any child components.
src/use_coroutine.rs
// import futures::StreamExt to use the next() method use futures::StreamExt; let response_state = use_state(cx, || None); let tx = use_coroutine(cx, |mut rx| { to_owned![response_state]; async move { // Define your state before the loop let mut state = reqwest::Client::new(); let mut cache: HashMap<String, String> = HashMap::new(); loop { // Loop and wait for the next message if let Some(request) = rx.next().await { // Resolve the message let response = if let Some(response) = cache.get(&request) { response.clone() } else { let response = state .get(&request) .send() .await .unwrap() .text() .await .unwrap(); cache.insert(request, response.clone()); response }; response_state.set(Some(response)); } else { break; } } } }); // Send a message to the coroutine tx.send("https://example.com".to_string()); // Get the current state of the coroutine let response = response_state.get();
Making Reactive State External
If you have some reactive state (state that is rendered), that you want to modify from another thread, you can use the use_rw hook in the dioxus-std crate.
The use_rw hook works like the use_ref hook, but it is Send + Sync which makes it possible to move the hook into another thread.