dnrops
/
dioxuslab
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: rename all &cx to cx, make clipppy happy

This commit is contained in:
Jonathan Kelley 2022-12-07 13:11:40 -08:00
parent e8133e9449
commit 4eefc3f854
85 changed files with 256 additions and 271 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -54,7 +54,7 @@ Dioxus is a portable, performant, and ergonomic framework for building cross-pla
```rust
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx! {
h1 { "High-Five counter: {count}" }

2
docs/guide/examples/conditional_rendering.rs
View File

@ -6,7 +6,7 @@ fn main() {
}
pub fn App(cx: Scope) -> Element {
let is_logged_in = use_state(&cx, || false);
let is_logged_in = use_state(cx, || false);
cx.render(rsx!(LogIn {
is_logged_in: **is_logged_in,

12
docs/guide/examples/hooks_bad.rs
View File

@ -17,13 +17,13 @@ fn App(cx: Scope) -> Element {
// But `if` statements only run if the conditional is true!
// So we might violate rule 2.
if you_are_happy && you_know_it {
let something = use_state(&cx, || "hands");
let something = use_state(cx, || "hands");
println!("clap your {something}")
}
// ✅ instead, *always* call use_state
// You can put other stuff in the conditional though
let something = use_state(&cx, || "hands");
let something = use_state(cx, || "hands");
if you_are_happy && you_know_it {
println!("clap your {something}")
}
@ -33,12 +33,12 @@ fn App(cx: Scope) -> Element {
// ❌ don't call hooks inside closures!
// We can't guarantee that the closure, if used, will be called at the same time every time
let _a = || {
let b = use_state(&cx, || 0);
let b = use_state(cx, || 0);
b.get()
};
// ✅ instead, move hook `b` outside
let b = use_state(&cx, || 0);
let b = use_state(cx, || 0);
let _a = || b.get();
// ANCHOR_END: closure
@ -50,12 +50,12 @@ fn App(cx: Scope) -> Element {
// ❌ Do not use hooks in loops!
// In this case, if the length of the Vec changes, we break rule 2
for _name in &names {
let is_selected = use_state(&cx, || false);
let is_selected = use_state(cx, || false);
println!("selected: {is_selected}");
}
// ✅ Instead, use a hashmap with use_ref
let selection_map = use_ref(&cx, HashMap::<&str, bool>::new);
let selection_map = use_ref(cx, HashMap::<&str, bool>::new);
for name in &names {
let is_selected = selection_map.read()[name];

2
docs/guide/examples/hooks_counter.rs
View File

@ -7,7 +7,7 @@ fn main() {
// ANCHOR: component
fn App(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx!(
h1 { "High-Five counter: {count}" }

4
docs/guide/examples/hooks_counter_two_state.rs
View File

@ -8,8 +8,8 @@ fn main() {
// ANCHOR: component
fn App(cx: Scope) -> Element {
// ANCHOR: use_state_calls
let mut count_a = use_state(&cx, || 0);
let mut count_b = use_state(&cx, || 0);
let mut count_a = use_state(cx, || 0);
let mut count_b = use_state(cx, || 0);
// ANCHOR_END: use_state_calls
cx.render(rsx!(

2
docs/guide/examples/hooks_use_ref.rs
View File

@ -7,7 +7,7 @@ fn main() {
// ANCHOR: component
fn App(cx: Scope) -> Element {
let list = use_ref(&cx, Vec::new);
let list = use_ref(cx, Vec::new);
let list_formatted = format!("{:?}", *list.read());
cx.render(rsx!(

2
docs/guide/examples/input_controlled.rs
View File

@ -7,7 +7,7 @@ fn main() {
// ANCHOR: component
fn App(cx: Scope) -> Element {
let name = use_state(&cx, || "bob".to_string());
let name = use_state(cx, || "bob".to_string());
cx.render(rsx! {
input {

2
docs/guide/examples/meme_editor.rs
View File

@ -18,7 +18,7 @@ fn MemeEditor(cx: Scope) -> Element {
width: fit-content;
";
let caption = use_state(&cx, || "me waiting for my rust code to compile".to_string());
let caption = use_state(cx, || "me waiting for my rust code to compile".to_string());
cx.render(rsx! {
div {

12
docs/guide/examples/meme_editor_dark_mode.rs
View File

@ -14,10 +14,10 @@ struct DarkMode(bool);
pub fn App(cx: Scope) -> Element {
// ANCHOR: context_provider
use_context_provider(&cx, || DarkMode(false));
use_context_provider(cx, || DarkMode(false));
// ANCHOR_END: context_provider
let is_dark_mode = use_is_dark_mode(&cx);
let is_dark_mode = use_is_dark_mode(cx);
let wrapper_style = if is_dark_mode {
r"
@ -47,7 +47,7 @@ pub fn use_is_dark_mode(cx: &ScopeState) -> bool {
// ANCHOR: toggle
pub fn DarkModeToggle(cx: Scope) -> Element {
let dark_mode = use_context::<DarkMode>(&cx)?;
let dark_mode = use_context::<DarkMode>(cx)?;
let style = if dark_mode.read().0 {
"color:white"
@ -71,7 +71,7 @@ pub fn DarkModeToggle(cx: Scope) -> Element {
// ANCHOR: meme_editor
fn MemeEditor(cx: Scope) -> Element {
let is_dark_mode = use_is_dark_mode(&cx);
let is_dark_mode = use_is_dark_mode(cx);
let heading_style = if is_dark_mode { "color: white" } else { "" };
let container_style = r"
@ -82,7 +82,7 @@ fn MemeEditor(cx: Scope) -> Element {
width: fit-content;
";
let caption = use_state(&cx, || "me waiting for my rust code to compile".to_string());
let caption = use_state(cx, || "me waiting for my rust code to compile".to_string());
cx.render(rsx! {
div {
@ -152,7 +152,7 @@ fn CaptionEditor<'a>(
caption: &'a str,
on_input: EventHandler<'a, FormData>,
) -> Element<'a> {
let is_dark_mode = use_is_dark_mode(&cx);
let is_dark_mode = use_is_dark_mode(cx);
let colors = if is_dark_mode {
r"

6
docs/guide/examples/rendering_lists.rs
View File

@ -14,9 +14,9 @@ struct Comment {
pub fn App(cx: Scope) -> Element {
// ANCHOR: render_list
let comment_field = use_state(&cx, String::new);
let mut next_id = use_state(&cx, || 0);
let comments = use_ref(&cx, Vec::<Comment>::new);
let comment_field = use_state(cx, String::new);
let mut next_id = use_state(cx, || 0);
let comments = use_ref(cx, Vec::<Comment>::new);
let comments_lock = comments.read();
let comments_rendered = comments_lock.iter().map(|comment| {

10
docs/guide/examples/spawn.rs
View File

@ -8,7 +8,7 @@ fn main() {
fn App(cx: Scope) -> Element {
// ANCHOR: spawn
let logged_in = use_state(&cx, || false);
let logged_in = use_state(cx, || false);
let log_in = move |_| {
cx.spawn({
@ -62,10 +62,10 @@ pub fn Tokio(cx: Scope) -> Element {
}
pub fn ToOwnedMacro(cx: Scope) -> Element {
let count = use_state(&cx, || 0);
let age = use_state(&cx, || 0);
let name = use_state(&cx, || 0);
let description = use_state(&cx, || 0);
let count = use_state(cx, || 0);
let age = use_state(cx, || 0);
let name = use_state(cx, || 0);
let description = use_state(cx, || 0);
let _ = || {
// ANCHOR: to_owned_macro

4
docs/guide/examples/use_future.rs
View File

@ -14,7 +14,7 @@ struct ApiResponse {
fn App(cx: Scope) -> Element {
// ANCHOR: use_future
let future = use_future(&cx, (), |_| async move {
let future = use_future(cx, (), |_| async move {
reqwest::get("https://dog.ceo/api/breeds/image/random")
.await
.unwrap()
@ -47,7 +47,7 @@ fn App(cx: Scope) -> Element {
#[inline_props]
fn RandomDog(cx: Scope, breed: String) -> Element {
// ANCHOR: dependency
let future = use_future(&cx, (breed,), |(breed,)| async move {
let future = use_future(cx, (breed,), |(breed,)| async move {
reqwest::get(format!("https://dog.ceo/api/breed/{breed}/images/random"))
.await
.unwrap()

22
docs/guide/src/en/__unused/advanced-guides/12-signals.md
View File

@ -12,7 +12,7 @@ Your component today might look something like this:
```rust
fn Comp(cx: Scope) -> DomTree {
let (title, set_title) = use_state(&cx, || "Title".to_string());
let (title, set_title) = use_state(cx, || "Title".to_string());
cx.render(rsx!{
input {
value: title,
@ -26,7 +26,7 @@ This component is fairly straightforward – the input updates its own value on
```rust
fn Comp(cx: Scope) -> DomTree {
let (title, set_title) = use_state(&cx, || "Title".to_string());
let (title, set_title) = use_state(cx, || "Title".to_string());
cx.render(rsx!{
div {
input {
@ -49,7 +49,7 @@ We can use signals to generate a two-way binding between data and the input box.
```rust
fn Comp(cx: Scope) -> DomTree {
let mut title = use_signal(&cx, || String::from("Title"));
let mut title = use_signal(cx, || String::from("Title"));
cx.render(rsx!(input { value: title }))
}
```
@ -58,8 +58,8 @@ For a slightly more interesting example, this component calculates the sum betwe
```rust
fn Calculator(cx: Scope) -> DomTree {
let mut a = use_signal(&cx, || 0);
let mut b = use_signal(&cx, || 0);
let mut a = use_signal(cx, || 0);
let mut b = use_signal(cx, || 0);
let mut c = a + b;
rsx! {
input { value: a }
@ -72,8 +72,8 @@ fn Calculator(cx: Scope) -> DomTree {
Do you notice how we can use built-in operations on signals? Under the hood, we actually create a new derived signal that depends on `a` and `b`. Whenever `a` or `b` update, then `c` will update. If we need to create a new derived signal that's more complex than a basic operation (`std::ops`) we can either chain signals together or combine them:
```rust
let mut a = use_signal(&cx, || 0);
let mut b = use_signal(&cx, || 0);
let mut a = use_signal(cx, || 0);
let mut b = use_signal(cx, || 0);
// Chain signals together using the `with` method
let c = a.with(b).map(|(a, b)| *a + *b);
@ -84,7 +84,7 @@ let c = a.with(b).map(|(a, b)| *a + *b);
If we ever need to get the value out of a signal, we can simply `deref` it.
```rust
let mut a = use_signal(&cx, || 0);
let mut a = use_signal(cx, || 0);
let c = *a + *b;
```
@ -97,7 +97,7 @@ Sometimes you want a signal to propagate across your app, either through far-awa
```rust
const TITLE: Atom<String> = || "".to_string();
const Provider: Component = |cx|{
let title = use_signal(&cx, &TITLE);
let title = use_signal(cx, &TITLE);
render!(input { value: title })
};
```
@ -106,7 +106,7 @@ If we use the `TITLE` atom in another component, we can cause updates to flow be
```rust
const Receiver: Component = |cx|{
let title = use_signal(&cx, &TITLE);
let title = use_signal(cx, &TITLE);
log::info!("This will only be called once!");
rsx!(cx,
div {
@ -133,7 +133,7 @@ Dioxus automatically understands how to use your signals when mixed with iterato
```rust
const DICT: AtomFamily<String, String> = |_| {};
const List: Component = |cx|{
let dict = use_signal(&cx, &DICT);
let dict = use_signal(cx, &DICT);
cx.render(rsx!(
ul {
For { each: dict, map: |k, v| rsx!( li { "{v}" }) }

2
docs/guide/src/en/__unused/composing.md
View File

@ -59,7 +59,7 @@ If we represented the reactive graph presented above in Dioxus, it would look ve
// Declare a component that holds our datasources and calculates `g`
fn RenderGraph(cx: Scope) -> Element {
let seconds = use_datasource(SECONDS);
let constant = use_state(&cx, || 1);
let constant = use_state(cx, || 1);
cx.render(rsx!(
RenderG { seconds: seconds }

12
docs/guide/src/en/__unused/fanout.md
View File

@ -28,8 +28,8 @@ If we used global state like use_context or fermi, we might be tempted to inject
```rust
fn Titlebar(cx: Scope<TitlebarProps>) -> Element {
let title = use_read(&cx, TITLE);
let subtitle = use_read(&cx, SUBTITLE);
let title = use_read(cx, TITLE);
let subtitle = use_read(cx, SUBTITLE);
cx.render(rsx!{/* ui */})
}
@ -43,11 +43,11 @@ To enable our titlebar component to be used across apps, we want to lift our ato
```rust
fn DocsiteTitlesection(cx: Scope) {
let title = use_read(&cx, TITLE);
let subtitle = use_read(&cx, SUBTITLE);
let title = use_read(cx, TITLE);
let subtitle = use_read(cx, SUBTITLE);
let username = use_read(&cx, USERNAME);
let points = use_read(&cx, POINTS);
let username = use_read(cx, USERNAME);
let points = use_read(cx, POINTS);
cx.render(rsx!{
TitleBar { title: title, subtitle: subtitle }

14
docs/guide/src/en/__unused/localstate.md
View File

@ -13,7 +13,7 @@ struct Todo {
is_editing: bool,
}
let todos = use_ref(&cx, || vec![Todo::new()]);
let todos = use_ref(cx, || vec![Todo::new()]);
cx.render(rsx!{
ul {
@ -40,7 +40,7 @@ Instead, let's refactor our Todo component to handle its own state:
```rust
#[inline_props]
fn Todo<'a>(cx: Scope, todo: &'a Todo) -> Element {
let is_hovered = use_state(&cx, || false);
let is_hovered = use_state(cx, || false);
cx.render(rsx!{
li {
@ -80,15 +80,15 @@ struct State {
}
// in the component
let state = use_ref(&cx, State::new)
let state = use_ref(cx, State::new)
```
The "better" approach for this particular component would be to break the state apart into different values:
```rust
let count = use_state(&cx, || 0);
let color = use_state(&cx, || "red");
let names = use_state(&cx, HashMap::new);
let count = use_state(cx, || 0);
let color = use_state(cx, || "red");
let names = use_state(cx, HashMap::new);
```
You might recognize that our "names" value is a HashMap – which is not terribly cheap to clone every time we update its value. To solve this issue, we *highly* suggest using a library like [`im`](https://crates.io/crates/im) which will take advantage of structural sharing to make clones and mutations much cheaper.
@ -96,7 +96,7 @@ You might recognize that our "names" value is a HashMap – which is not terribl
When combined with the `make_mut` method on `use_state`, you can get really succinct updates to collections:
```rust
let todos = use_state(&cx, im_rc::HashMap::default);
let todos = use_state(cx, im_rc::HashMap::default);
todos.make_mut().insert("new todo", Todo {
contents: "go get groceries",

4
docs/guide/src/en/__unused/memoization.md
View File

@ -8,8 +8,8 @@ For example, let's say we have a component that has two children:
```rust
fn Demo(cx: Scope) -> Element {
// don't worry about these 2, we'll cover them later
let name = use_state(&cx, || String::from("bob"));
let age = use_state(&cx, || 21);
let name = use_state(cx, || String::from("bob"));
let age = use_state(cx, || 21);
cx.render(rsx!{
Name { name: name }

2
docs/guide/src/en/__unused/model_pattern.md
View File

@ -20,7 +20,7 @@ Our component is really simple – we just call `use_ref` to get an initial calc
```rust
fn app(cx: Scope) -> Element {
let state = use_ref(&cx, Calculator::new);
let state = use_ref(cx, Calculator::new);
cx.render(rsx!{
// the rendering code

24
docs/guide/src/en/async/use_coroutine.md
View File

@ -10,7 +10,7 @@ The basic setup for coroutines is the `use_coroutine` hook. Most coroutines we w
```rust
fn app(cx: Scope) -> Element {
let ws: &UseCoroutine<()> = use_coroutine(&cx, |rx| async move {
let ws: &UseCoroutine<()> = use_coroutine(cx, |rx| async move {
// Connect to some sort of service
let mut conn = connect_to_ws_server().await;
@ -27,7 +27,7 @@ For many services, a simple async loop will handle the majority of use cases.
However, if we want to temporarily disable the coroutine, we can "pause" it using the `pause` method, and "resume" it using the `resume` method:
```rust
let sync: &UseCoroutine<()> = use_coroutine(&cx, |rx| async move {
let sync: &UseCoroutine<()> = use_coroutine(cx, |rx| async move {
// code for syncing
});
@ -63,7 +63,7 @@ enum ProfileUpdate {
SetAge(i32)
}
let profile = use_coroutine(&cx, |mut rx: UnboundedReciver<ProfileUpdate>| async move {
let profile = use_coroutine(cx, |mut rx: UnboundedReciver<ProfileUpdate>| async move {
let mut server = connect_to_server().await;
while let Ok(msg) = rx.next().await {
@ -86,9 +86,9 @@ cx.render(rsx!{
For sufficiently complex apps, we could build a bunch of different useful "services" that loop on channels to update the app.
```rust
let profile = use_coroutine(&cx, profile_service);
let editor = use_coroutine(&cx, editor_service);
let sync = use_coroutine(&cx, sync_service);
let profile = use_coroutine(cx, profile_service);
let editor = use_coroutine(cx, editor_service);
let sync = use_coroutine(cx, sync_service);
async fn profile_service(rx: UnboundedReceiver<ProfileCommand>) {
// do stuff
@ -109,9 +109,9 @@ We can combine coroutines with Fermi to emulate Redux Toolkit's Thunk system wit
static USERNAME: Atom<String> = |_| "default".to_string();
fn app(cx: Scope) -> Element {
let atoms = use_atom_root(&cx);
let atoms = use_atom_root(cx);
use_coroutine(&cx, |rx| sync_service(rx, atoms.clone()));
use_coroutine(cx, |rx| sync_service(rx, atoms.clone()));
cx.render(rsx!{
Banner {}
@ -119,7 +119,7 @@ fn app(cx: Scope) -> Element {
}
fn Banner(cx: Scope) -> Element {
let username = use_read(&cx, USERNAME);
let username = use_read(cx, USERNAME);
cx.render(rsx!{
h1 { "Welcome back, {username}" }
@ -158,8 +158,8 @@ To yield values from a coroutine, simply bring in a `UseState` handle and set th
```rust
let sync_status = use_state(&cx, || Status::Launching);
let sync_task = use_coroutine(&cx, |rx: UnboundedReceiver<SyncAction>| {
let sync_status = use_state(cx, || Status::Launching);
let sync_task = use_coroutine(cx, |rx: UnboundedReceiver<SyncAction>| {
to_owned![sync_status];
async move {
loop {
@ -176,7 +176,7 @@ Coroutine handles are automatically injected through the context API. `use_corou
```rust
fn Child(cx: Scope) -> Element {
let sync_task = use_coroutine_handle::<SyncAction>(&cx);
let sync_task = use_coroutine_handle::<SyncAction>(cx);
sync_task.send(SyncAction::SetUsername);
}

10
docs/guide/src/en/best_practices/error_handling.md
View File

@ -56,7 +56,7 @@ The next "best" way of handling errors in Dioxus is to match on the error locall
To do this, we simply have an error state built into our component:
```rust
let err = use_state(&cx, || None);
let err = use_state(cx, || None);
```
Whenever we perform an action that generates an error, we'll set that error state. We can then match on the error in a number of ways (early return, return Element, etc).
@ -64,7 +64,7 @@ Whenever we perform an action that generates an error, we'll set that error stat
```rust
fn Commandline(cx: Scope) -> Element {
let error = use_state(&cx, || None);
let error = use_state(cx, || None);
cx.render(match *error {
Some(error) => rsx!(
@ -85,7 +85,7 @@ If you're dealing with a handful of components with minimal nesting, you can jus
```rust
fn Commandline(cx: Scope) -> Element {
let error = use_state(&cx, || None);
let error = use_state(cx, || None);
if let Some(error) = **error {
return cx.render(rsx!{ "An error occured" });
@ -125,7 +125,7 @@ Then, in our top level component, we want to explicitly handle the possible erro
```rust
fn TopLevel(cx: Scope) -> Element {
let error = use_read(&cx, INPUT_ERROR);
let error = use_read(cx, INPUT_ERROR);
match error {
TooLong => return cx.render(rsx!{ "FAILED: Too long!" }),
@ -139,7 +139,7 @@ Now, whenever a downstream component has an error in its actions, it can simply
```rust
fn Commandline(cx: Scope) -> Element {
let set_error = use_set(&cx, INPUT_ERROR);
let set_error = use_set(cx, INPUT_ERROR);
cx.render(rsx!{
input {

2
docs/guide/src/en/index.md
View File

@ -6,7 +6,7 @@ Dioxus is a portable, performant, and ergonomic framework for building cross-pla
```rust
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx!(
h1 { "High-Five counter: {count}" }

24
docs/guide/src/pt-br/async/use_coroutine.md
View File

@ -10,7 +10,7 @@ A configuração básica para corrotinas é o _hook_ `use_coroutine`. A maioria
```rust
fn app(cx: Scope) -> Element {
let ws: &UseCoroutine<()> = use_coroutine(&cx, |rx| async move {
let ws: &UseCoroutine<()> = use_coroutine(cx, |rx| async move {
// Connect to some sort of service
let mut conn = connect_to_ws_server().await;
@ -27,7 +27,7 @@ Para muitos serviços, um _loop_ assíncrono simples lidará com a maioria dos c
No entanto, se quisermos desabilitar temporariamente a corrotina, podemos "pausá-la" usando o método `pause` e "retomá-la" usando o método `resume`:
```rust
let sync: &UseCoroutine<()> = use_coroutine(&cx, |rx| async move {
let sync: &UseCoroutine<()> = use_coroutine(cx, |rx| async move {
// code for syncing
});
@ -62,7 +62,7 @@ enum ProfileUpdate {
SetAge(i32)
}
let profile = use_coroutine(&cx, |mut rx: UnboundedReciver<ProfileUpdate>| async move {
let profile = use_coroutine(cx, |mut rx: UnboundedReciver<ProfileUpdate>| async move {
let mut server = connect_to_server().await;
while let Ok(msg) = rx.next().await {
@ -85,9 +85,9 @@ cx.render(rsx!{
Para aplicativos suficientemente complexos, poderíamos criar vários "serviços" úteis diferentes que fazem um _loop_ nos canais para atualizar o aplicativo.
```rust
let profile = use_coroutine(&cx, profile_service);
let editor = use_coroutine(&cx, editor_service);
let sync = use_coroutine(&cx, sync_service);
let profile = use_coroutine(cx, profile_service);
let editor = use_coroutine(cx, editor_service);
let sync = use_coroutine(cx, sync_service);
async fn profile_service(rx: UnboundedReceiver<ProfileCommand>) {
// do stuff
@ -108,9 +108,9 @@ Podemos combinar corrotinas com `Fermi` para emular o sistema `Thunk` do **Redux
static USERNAME: Atom<String> = |_| "default".to_string();
fn app(cx: Scope) -> Element {
let atoms = use_atom_root(&cx);
let atoms = use_atom_root(cx);
use_coroutine(&cx, |rx| sync_service(rx, atoms.clone()));
use_coroutine(cx, |rx| sync_service(rx, atoms.clone()));
cx.render(rsx!{
Banner {}
@ -118,7 +118,7 @@ fn app(cx: Scope) -> Element {
}
fn Banner(cx: Scope) -> Element {
let username = use_read(&cx, USERNAME);
let username = use_read(cx, USERNAME);
cx.render(rsx!{
h1 { "Welcome back, {username}" }
@ -156,8 +156,8 @@ async fn sync_service(mut rx: UnboundedReceiver<SyncAction>, atoms: AtomRoot) {
Para obter valores de uma corrotina, basta usar um identificador `UseState` e definir o valor sempre que sua corrotina concluir seu trabalho.
```rust
let sync_status = use_state(&cx, || Status::Launching);
let sync_task = use_coroutine(&cx, |rx: UnboundedReceiver<SyncAction>| {
let sync_status = use_state(cx, || Status::Launching);
let sync_task = use_coroutine(cx, |rx: UnboundedReceiver<SyncAction>| {
to_owned![sync_status];
async move {
loop {
@ -174,7 +174,7 @@ Os identificadores de corrotina são injetados automaticamente por meio da API d
```rust
fn Child(cx: Scope) -> Element {
let sync_task = use_coroutine_handle::<SyncAction>(&cx);
let sync_task = use_coroutine_handle::<SyncAction>(cx);
sync_task.send(SyncAction::SetUsername);
}

10
docs/guide/src/pt-br/best_practices/error_handling.md
View File

@ -53,14 +53,14 @@ A próxima "melhor" maneira de lidar com erros no Dioxus é combinar (`match`) o
Para fazer isso, simplesmente temos um estado de erro embutido em nosso componente:
```rust
let err = use_state(&cx, || None);
let err = use_state(cx, || None);
```
Sempre que realizarmos uma ação que gere um erro, definiremos esse estado de erro. Podemos então combinar o erro de várias maneiras (retorno antecipado, elemento de retorno etc.).
```rust
fn Commandline(cx: Scope) -> Element {
let error = use_state(&cx, || None);
let error = use_state(cx, || None);
cx.render(match *error {
Some(error) => rsx!(
@ -81,7 +81,7 @@ Se você estiver lidando com alguns componentes com um mínimo de aninhamento, b
```rust
fn Commandline(cx: Scope) -> Element {
let error = use_state(&cx, || None);
let error = use_state(cx, || None);
if let Some(error) = **error {
return cx.render(rsx!{ "An error occured" });
@ -120,7 +120,7 @@ Então, em nosso componente de nível superior, queremos tratar explicitamente o
```rust
fn TopLevel(cx: Scope) -> Element {
let error = use_read(&cx, INPUT_ERROR);
let error = use_read(cx, INPUT_ERROR);
match error {
TooLong => return cx.render(rsx!{ "FAILED: Too long!" }),
@ -134,7 +134,7 @@ Agora, sempre que um componente _downstream_ tiver um erro em suas ações, ele
```rust
fn Commandline(cx: Scope) -> Element {
let set_error = use_set(&cx, INPUT_ERROR);
let set_error = use_set(cx, INPUT_ERROR);
cx.render(rsx!{
input {

2
docs/guide/src/pt-br/index.md
View File

@ -6,7 +6,7 @@ Dioxus é uma estrutura portátil, de alto desempenho e ergonômica para a const
```rust
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx!(
h1 { "High-Five counter: {count}" }

14
docs/posts/release-0-2-0.md
View File

@ -27,7 +27,7 @@ Dioxus is a recently-released library for building interactive user interfaces (
```rust
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx! {
h1 { "Count: {count}" }
@ -102,8 +102,8 @@ We're also using hooks to parse the URL parameters and segments so you can inter
struct Query { name: String }
fn BlogPost(cx: Scope) -> Element {
let post = use_route(&cx).segment("post")?;
let query = use_route(&cx).query::<Query>()?;
let post = use_route(cx).segment("post")?;
let query = use_route(cx).query::<Query>()?;
cx.render(rsx!{
"Viewing post {post}"
@ -128,7 +128,7 @@ static TITLE: Atom<&str> = |_| "Hello";
// Read the value from anywhere in the app, subscribing to any changes
fn app(cx: Scope) -> Element {
let title = use_read(&cx, TITLE);
let title = use_read(cx, TITLE);
cx.render(rsx!{
h1 { "{title}" }
Child {}
@ -137,7 +137,7 @@ fn app(cx: Scope) -> Element {
// Set the value from anywhere in the app
fn Child(cx: Scope) -> Element {
let set_title = use_set(&cx, TITLE);
let set_title = use_set(cx, TITLE);
cx.render(rsx!{
button {
onclick: move |_| set_title("goodbye"),
@ -245,7 +245,7 @@ First, we upgraded the `use_future` hook. It now supports dependencies, which le
```rust
fn RenderDog(cx: Scope, breed: String) -> Element {
let dog_request = use_future(&cx, (breed,), |(breed,)| async move {
let dog_request = use_future(cx, (breed,), |(breed,)| async move {
reqwest::get(format!("https://dog.ceo/api/breed/{}/images/random", breed))
.await
.unwrap()
@ -265,7 +265,7 @@ Additionally, we added better support for coroutines. You can now start, stop, r
```rust
fn App(cx: Scope) -> Element {
let sync_task = use_coroutine(&cx, |rx| async move {
let sync_task = use_coroutine(cx, |rx| async move {
connect_to_server().await;
let state = MyState::new();

10
docs/posts/release.md
View File

@ -28,7 +28,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx! {
h1 { "Count: {count}" }
@ -138,7 +138,7 @@ struct CardProps {
}
static Card: Component<CardProps> = |cx| {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx!(
aside {
h2 { "{cx.props.title}" }
@ -191,7 +191,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx! {
h1 { "Count: {count}" }
@ -260,7 +260,7 @@ Dioxus understands the lifetimes of data borrowed from `Scope`, so you can safel
```rust
let name = use_state(&cx, || "asd");
let name = use_state(cx, || "asd");
rsx! {
div {
button { onclick: move |_| name.set("abc") }
@ -274,7 +274,7 @@ Because we know the lifetime of your handlers, we can also expose this to childr
```rust
fn app(cx: Scope) -> Element {
let name = use_state(&cx, || "asd");
let name = use_state(cx, || "asd");
cx.render(rsx!{
Button { name: name }
})

4
docs/router/src/guide/building-a-nest.md
View File

@ -153,7 +153,7 @@ use dioxus::{
...
fn blog_post(cx: Scope) -> Element {
let route = use_route(&cx); // NEW
let route = use_route(cx); // NEW
let blog_text = "";
cx.render(rsx! {
@ -165,7 +165,7 @@ Dioxus Router provides built in methods to extract information from a route. We
The ``segment`` method also parses the parameter into any type for us. We'll use a match expression that handles a parsing error and on success, uses our helper function to grab the blog post.
```rs
fn blog_post(cx: Scope) -> Element {
let route = use_route(&cx);
let route = use_route(cx);
// NEW
let blog_text = match route.segment::<String>("post").unwrap() {

2
examples/all_events.rs
View File

@ -41,7 +41,7 @@ const RECT_STYLE: &str = r#"
"#;
fn app(cx: Scope) -> Element {
let events = use_ref(&cx, std::collections::VecDeque::new);
let events = use_ref(cx, std::collections::VecDeque::new);
let log_event = move |event: Event| {
let mut events = events.write();

2
examples/calculator.rs
View File

@ -19,7 +19,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || String::from("0"));
let val = use_state(cx, || String::from("0"));
let input_digit = move |num: u8| {
if val.get() == "0" {

8
examples/crm.rs
View File

@ -16,10 +16,10 @@ pub struct Client {
}
fn app(cx: Scope) -> Element {
let clients = use_ref(&cx, || vec![] as Vec<Client>);
let firstname = use_state(&cx, String::new);
let lastname = use_state(&cx, String::new);
let description = use_state(&cx, String::new);
let clients = use_ref(cx, || vec![] as Vec<Client>);
let firstname = use_state(cx, String::new);
let lastname = use_state(cx, String::new);
let description = use_state(cx, String::new);
cx.render(rsx!(
body {

2
examples/custom_element.rs
View File

@ -16,7 +16,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
// let nf = NodeFactory::new(&cx);
// let nf = NodeFactory::new(cx);
// let mut attrs = dioxus::core::exports::bumpalo::collections::Vec::new_in(nf.bump());

2
examples/disabled.rs
View File

@ -5,7 +5,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let disabled = use_state(&cx, || false);
let disabled = use_state(cx, || false);
cx.render(rsx! {
div {

2
examples/error_handle.rs
View File

@ -5,7 +5,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || "0.0001");
let val = use_state(cx, || "0.0001");
let num = match val.parse::<f32>() {
Err(_) => return cx.render(rsx!("Parsing failed")),

4
examples/eval.rs
View File

@ -5,8 +5,8 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let script = use_state(&cx, String::new);
let eval = dioxus_desktop::use_eval(&cx);
let script = use_state(cx, String::new);
let eval = dioxus_desktop::use_eval(cx);
cx.render(rsx! {
div {

6
examples/fermi.rs
View File

@ -10,7 +10,7 @@ fn main() {
static NAME: Atom<String> = |_| "world".to_string();
fn app(cx: Scope) -> Element {
let name = use_read(&cx, NAME);
let name = use_read(cx, NAME);
cx.render(rsx! {
div { "hello {name}!" }
@ -20,7 +20,7 @@ fn app(cx: Scope) -> Element {
}
fn Child(cx: Scope) -> Element {
let set_name = use_set(&cx, NAME);
let set_name = use_set(cx, NAME);
cx.render(rsx! {
button {
@ -33,7 +33,7 @@ fn Child(cx: Scope) -> Element {
static NAMES: AtomRef<Vec<String>> = |_| vec!["world".to_string()];
fn ChildWithRef(cx: Scope) -> Element {
let names = use_atom_ref(&cx, NAMES);
let names = use_atom_ref(cx, NAMES);
cx.render(rsx! {
div {

2
examples/file_explorer.rs
View File

@ -19,7 +19,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let files = use_ref(&cx, Files::new);
let files = use_ref(cx, Files::new);
cx.render(rsx! {
div {

4
examples/framework_benchmark.rs
View File

@ -32,8 +32,8 @@ impl Label {
}
fn app(cx: Scope) -> Element {
let items = use_ref(&cx, Vec::new);
let selected = use_state(&cx, || None);
let items = use_ref(cx, Vec::new);
let selected = use_state(cx, || None);
cx.render(rsx! {
div { class: "container",

2
examples/hydration.rs
View File

@ -20,7 +20,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || 0);
let val = use_state(cx, || 0);
cx.render(rsx! {
div {

2
examples/inlineprops.rs
View File

@ -28,7 +28,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let state = use_state(&cx, || 1);
let state = use_state(cx, || 1);
cx.render(rsx! {
div {

2
examples/pattern_model.rs
View File

@ -36,7 +36,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let state = use_ref(&cx, Calculator::new);
let state = use_ref(cx, Calculator::new);
cx.render(rsx! {
style { include_str!("./assets/calculator.css") }

2
examples/pattern_reducer.rs
View File

@ -15,7 +15,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let state = use_state(&cx, PlayerState::new);
let state = use_state(cx, PlayerState::new);
cx.render(rsx!(
div {

2
examples/readme.rs
View File

@ -9,7 +9,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx! {
h1 { "High-Five counter: {count}" }

6
examples/router.rs
View File

@ -30,7 +30,7 @@ fn app(cx: Scope) -> Element {
}
fn BlogPost(cx: Scope) -> Element {
let post = dioxus_router::use_route(&cx).last_segment().unwrap();
let post = dioxus_router::use_route(cx).last_segment().unwrap();
cx.render(rsx! {
div {
@ -46,9 +46,9 @@ struct Query {
}
fn User(cx: Scope) -> Element {
let post = dioxus_router::use_route(&cx).last_segment().unwrap();
let post = dioxus_router::use_route(cx).last_segment().unwrap();
let query = dioxus_router::use_route(&cx)
let query = dioxus_router::use_route(cx)
.query::<Query>()
.unwrap_or(Query { bold: false });

6
examples/rsx_compile_fail.rs
View File

@ -13,14 +13,14 @@ fn main() {
}
fn example(cx: Scope) -> Element {
let items = use_state(&cx, || {
let items = use_state(cx, || {
vec![Thing {
a: "asd".to_string(),
b: 10,
}]
});
let things = use_ref(&cx, || {
let things = use_ref(cx, || {
vec![Thing {
a: "asd".to_string(),
b: 10,
@ -28,7 +28,7 @@ fn example(cx: Scope) -> Element {
});
let things_list = things.read();
let mything = use_ref(&cx, || Some(String::from("asd")));
let mything = use_ref(cx, || Some(String::from("asd")));
let mything_read = mything.read();
cx.render(rsx!(

2
examples/rsx_usage.rs
View File

@ -200,7 +200,7 @@ fn app(cx: Scope) -> Element {
// helper functions
// Anything that implements IntoVnode can be dropped directly into Rsx
helper(&cx, "hello world!")
helper(cx, "hello world!")
// Strings can be supplied directly
String::from("Hello world!")

18
examples/ssr.rs
View File

@ -2,16 +2,13 @@
//!
//! This example shows how we can render the Dioxus Virtualdom using SSR.
use std::fmt::Write;
use dioxus::prelude::*;
use dioxus_ssr::config::Config;
fn main() {
// We can render VirtualDoms
let mut vdom = VirtualDom::new(app);
let _ = vdom.rebuild();
println!("{}", dioxus_ssr::render_vdom(&vdom));
println!("{}", dioxus_ssr::render(&vdom));
// Or we can render rsx! calls themselves
println!(
@ -24,17 +21,12 @@ fn main() {
);
// We can configure the SSR rendering to add ids for rehydration
println!(
"{}",
dioxus_ssr::render_vdom_cfg(&vdom, Config::default().pre_render(true))
);
println!("{}", dioxus_ssr::pre_render(&vdom));
// We can even render as a writer
// We can render to a buf directly too
let mut file = String::new();
let _ = file.write_fmt(format_args!(
"{}",
dioxus_ssr::SsrRender::default().render_vdom(&vdom)
));
let mut renderer = dioxus_ssr::Renderer::default();
renderer.render_to(&mut file, &vdom).unwrap();
println!("{}", file);
}

2
examples/suspense.rs
View File

@ -53,7 +53,7 @@ fn app(cx: Scope) -> Element {
/// Suspense is achieved my moving the future into only the component that
/// actually renders the data.
fn Doggo(cx: Scope) -> Element {
let fut = use_future(&cx, (), |_| async move {
let fut = use_future(cx, (), |_| async move {
reqwest::get("https://dog.ceo/api/breeds/image/random/")
.await
.unwrap()

2
examples/svg.rs
View File

@ -7,7 +7,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || 5);
let val = use_state(cx, || 5);
cx.render(rsx! {
div {

4
examples/tasks.rs
View File

@ -10,9 +10,9 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let count = use_state(&cx, || 0);
let count = use_state(cx, || 0);
use_future(&cx, (), move |_| {
use_future(cx, (), move |_| {
let mut count = count.clone();
async move {
loop {

2
examples/textarea.rs
View File

@ -7,7 +7,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let model = use_state(&cx, || String::from("asd"));
let model = use_state(cx, || String::from("asd"));
println!("{}", model);

8
examples/window_event.rs
View File

@ -12,15 +12,15 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let window = dioxus_desktop::use_window(&cx);
let window = dioxus_desktop::use_window(cx);
// if you want to make window fullscreen, you need close the resizable.
// window.set_fullscreen(true);
// window.set_resizable(false);
let fullscreen = use_state(&cx, || false);
let always_on_top = use_state(&cx, || false);
let decorations = use_state(&cx, || false);
let fullscreen = use_state(cx, || false);
let always_on_top = use_state(cx, || false);
let decorations = use_state(cx, || false);
cx.render(rsx!(
link { href:"https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css", rel:"stylesheet" }

4
examples/window_zoom.rs
View File

@ -6,9 +6,9 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let window = use_window(&cx);
let window = use_window(cx);
let level = use_state(&cx, || 1.0);
let level = use_state(cx, || 1.0);
cx.render(rsx! {
input {
r#type: "number",

2
examples/xss_safety.rs
View File

@ -9,7 +9,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let contents = use_state(&cx, || {
let contents = use_state(cx, || {
String::from("<script>alert(\"hello world\")</script>")
});

4
notes/README.md
View File

@ -233,7 +233,7 @@ use hooks to define state and modify it from within listeners.
```rust, ignore
fn app(cx: Scope) -> Element {
let name = use_state(&cx, || "world");
let name = use_state(cx, || "world");
render!("hello {name}!")
}
@ -280,7 +280,7 @@ fn main() {
}
fn App(cx: Scope) -> Element {
let count = use_state(&cx, || 0);
let count = use_state(cx, || 0);
cx.render(rsx!(
div { "Count: {count}" }

2
notes/README/ZH_CN.md
View File

@ -54,7 +54,7 @@ Dioxus 是一个可移植的、高性能的、符合人体工程学的框架，
```rust
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx! {
h1 { "High-Five counter: {count}" }

4
notes/SOLVEDPROBLEMS.md
View File

@ -406,8 +406,8 @@ enum Patch {
```
```rust
let node_ref = use_node_ref(&cx);
use_effect(&cx, || {
let node_ref = use_node_ref(cx);
use_effect(cx, || {
}, []);
div { ref: node_ref,

7
packages/desktop/src/desktop_context.rs
View File

@ -21,9 +21,12 @@ pub fn use_window(cx: &ScopeState) -> &DesktopContext {
/// Get a closure that executes any JavaScript in the WebView context.
pub fn use_eval(cx: &ScopeState) -> &Rc<dyn Fn(String)> {
let desktop = use_window(cx).clone();
let desktop = use_window(cx);
&*cx.use_hook(|| Rc::new(move |script| desktop.eval(script)) as Rc<dyn Fn(String)>)
&*cx.use_hook(|| {
let desktop = desktop.clone();
Rc::new(move |script| desktop.eval(script))
} as Rc<dyn Fn(String)>)
}
/// An imperative interface to the current window.

4
packages/fermi/README.md
View File

@ -44,7 +44,7 @@ From anywhere in our app, we can read our the value of our atom:
```rust, ignore
fn NameCard(cx: Scope) -> Element {
let name = use_read(&cx, NAME);
let name = use_read(cx, NAME);
cx.render(rsx!{ h1 { "Hello, {name}"} })
}
```
@ -53,7 +53,7 @@ We can also set the value of our atom, also from anywhere in our app:
```rust, ignore
fn NameCard(cx: Scope) -> Element {
let set_name = use_set(&cx, NAME);
let set_name = use_set(cx, NAME);
cx.render(rsx!{
button {
onclick: move |_| set_name("Fermi"),

16
packages/fermi/src/hooks/state.rs
View File

@ -19,7 +19,7 @@ use std::{
/// static COUNT: Atom<u32> = |_| 0;
///
/// fn Example(cx: Scope) -> Element {
/// let mut count = use_atom_state(&cx, COUNT);
/// let mut count = use_atom_state(cx, COUNT);
///
/// cx.render(rsx! {
/// div {
@ -74,7 +74,7 @@ impl<T: 'static> AtomState<T> {
///
/// ```rust, ignore
/// fn component(cx: Scope) -> Element {
/// let count = use_state(&cx, || 0);
/// let count = use_state(cx, || 0);
/// cx.spawn({
/// let set_count = count.to_owned();
/// async move {
@ -101,7 +101,7 @@ impl<T: 'static> AtomState<T> {
///
/// ```rust, ignore
/// fn component(cx: Scope) -> Element {
/// let value = use_state(&cx, || 0);
/// let value = use_state(cx, || 0);
///
/// rsx!{
/// Component {
@ -128,7 +128,7 @@ impl<T: 'static> AtomState<T> {
/// # use dioxus_core::prelude::*;
/// # use dioxus_hooks::*;
/// fn component(cx: Scope) -> Element {
/// let value = use_state(&cx, || 0);
/// let value = use_state(cx, || 0);
///
/// // to increment the value
/// value.modify(|v| v + 1);
@ -168,7 +168,7 @@ impl<T: 'static> AtomState<T> {
/// # use dioxus_core::prelude::*;
/// # use dioxus_hooks::*;
/// fn component(cx: Scope) -> Element {
/// let value = use_state(&cx, || 0);
/// let value = use_state(cx, || 0);
///
/// let as_rc = value.get();
/// assert_eq!(as_rc.as_ref(), &0);
@ -190,7 +190,7 @@ impl<T: 'static> AtomState<T> {
///
/// ```rust, ignore
/// fn component(cx: Scope) -> Element {
/// let count = use_state(&cx, || 0);
/// let count = use_state(cx, || 0);
/// cx.spawn({
/// let count = count.to_owned();
/// async move {
@ -220,7 +220,7 @@ impl<T: Clone> AtomState<T> {
/// # Examples
///
/// ```ignore
/// let val = use_state(&cx, || 0);
/// let val = use_state(cx, || 0);
///
/// val.with_mut(|v| *v = 1);
/// ```
@ -243,7 +243,7 @@ impl<T: Clone> AtomState<T> {
/// # Examples
///
/// ```ignore
/// let val = use_state(&cx, || 0);
/// let val = use_state(cx, || 0);
///
/// *val.make_mut() += 1;
/// ```

4
packages/hooks/README.md
View File

@ -15,8 +15,8 @@ You can always use it "normally" with the `split` method:
```rust
// Rusty-smart-pointer usage:
let value = use_state(&cx, || 10);
let value = use_state(cx, || 10);
// "Classic" usage:
let (value, set_value) = use_state(&cx, || 0).split();
let (value, set_value) = use_state(cx, || 0).split();
```

2
packages/hooks/src/lib.rs
View File

@ -5,7 +5,7 @@
///
///
/// ```ignore
/// let (data) = use_ref(&cx, || {});
/// let (data) = use_ref(cx, || {});
///
/// let handle_thing = move |_| {
/// to_owned![data]

2
packages/hooks/src/usecollection.rs
View File

@ -16,7 +16,7 @@ This is moderately efficient because the fields of the map are moved, but the da
However, if you used similar approach with Dioxus:
```rust
let (map, set_map) = use_state(&cx, || HashMap::new());
let (map, set_map) = use_state(cx, || HashMap::new());
set_map({
let mut newmap = map.clone();
newmap.set(key, value);

8
packages/hooks/src/usecoroutine.rs
View File

@ -44,7 +44,7 @@ use crate::{use_context, use_context_provider};
/// Stop,
/// }
///
/// let chat_client = use_coroutine(&cx, |rx: UnboundedReceiver<Action>| async move {
/// let chat_client = use_coroutine(cx, |rx: UnboundedReceiver<Action>| async move {
/// while let Some(action) = rx.next().await {
/// match action {
/// Action::Start => {}
@ -119,15 +119,15 @@ mod tests {
use futures_util::StreamExt;
fn app(cx: Scope, name: String) -> Element {
let task = use_coroutine(&cx, |mut rx: UnboundedReceiver<i32>| async move {
let task = use_coroutine(cx, |mut rx: UnboundedReceiver<i32>| async move {
while let Some(msg) = rx.next().await {
println!("got message: {}", msg);
}
});
let task2 = use_coroutine(&cx, view_task);
let task2 = use_coroutine(cx, view_task);
let task3 = use_coroutine(&cx, |rx| complex_task(rx, 10));
let task3 = use_coroutine(cx, |rx| complex_task(rx, 10));
todo!()
}

8
packages/hooks/src/useeffect.rs
View File

@ -17,7 +17,7 @@ use crate::UseFutureDep;
///
/// #[inline_props]
/// fn app(cx: Scope, name: &str) -> Element {
/// use_effect(&cx, (name,), |(name,)| async move {
/// use_effect(cx, (name,), |(name,)| async move {
/// set_title(name);
/// }))
/// }
@ -72,17 +72,17 @@ mod tests {
fn app(cx: Scope<MyProps>) -> Element {
// should only ever run once
use_effect(&cx, (), |_| async move {
use_effect(cx, (), |_| async move {
//
});
// runs when a is changed
use_effect(&cx, (&cx.props.a,), |(a,)| async move {
use_effect(cx, (cx.props.a,), |(a,)| async move {
//
});
// runs when a or b is changed
use_effect(&cx, (&cx.props.a, &cx.props.b), |(a, b)| async move {
use_effect(cx, (cx.props.a, &cx.props.b), |(a, b)| async move {
//
});

4
packages/hooks/src/usefuture.rs
View File

@ -319,10 +319,10 @@ mod tests {
let fut = use_future(cx, (), |_| async move {});
// runs when a is changed
let fut = use_future(cx, (&cx.props.a,), |(a,)| async move {});
let fut = use_future(cx, (cx.props.a,), |(a,)| async move {});
// runs when a or b is changed
let fut = use_future(cx, (&cx.props.a, &cx.props.b), |(a, b)| async move { 123 });
let fut = use_future(cx, (cx.props.a, &cx.props.b), |(a, b)| async move { 123 });
let a = use_future!(cx, || async move {
// do the thing!

18
packages/hooks/src/usestate.rs
View File

@ -19,7 +19,7 @@ use std::{
///
/// ```ignore
/// const Example: Component = |cx| {
/// let count = use_state(&cx, || 0);
/// let count = use_state(cx, || 0);
///
/// cx.render(rsx! {
/// div {
@ -92,7 +92,7 @@ impl<T: 'static> UseState<T> {
///
/// ```rust, ignore
/// fn component(cx: Scope) -> Element {
/// let count = use_state(&cx, || 0);
/// let count = use_state(cx, || 0);
/// cx.spawn({
/// let set_count = count.to_owned();
/// async move {
@ -119,7 +119,7 @@ impl<T: 'static> UseState<T> {
///
/// ```rust, ignore
/// fn component(cx: Scope) -> Element {
/// let value = use_state(&cx, || 0);
/// let value = use_state(cx, || 0);
///
/// rsx!{
/// Component {
@ -144,7 +144,7 @@ impl<T: 'static> UseState<T> {
/// # use dioxus_core::prelude::*;
/// # use dioxus_hooks::*;
/// fn component(cx: Scope) -> Element {
/// let value = use_state(&cx, || 0);
/// let value = use_state(cx, || 0);
///
/// // to increment the value
/// value.modify(|v| v + 1);
@ -185,7 +185,7 @@ impl<T: 'static> UseState<T> {
/// # use dioxus_core::prelude::*;
/// # use dioxus_hooks::*;
/// fn component(cx: Scope) -> Element {
/// let value = use_state(&cx, || 0);
/// let value = use_state(cx, || 0);
///
/// let as_rc = value.get();
/// assert_eq!(as_rc.as_ref(), &0);
@ -207,7 +207,7 @@ impl<T: 'static> UseState<T> {
///
/// ```rust, ignore
/// fn component(cx: Scope) -> Element {
/// let count = use_state(&cx, || 0);
/// let count = use_state(cx, || 0);
/// cx.spawn({
/// let count = count.to_owned();
/// async move {
@ -237,7 +237,7 @@ impl<T: Clone> UseState<T> {
/// # Examples
///
/// ```rust, ignore
/// let val = use_state(&cx, || 0);
/// let val = use_state(cx, || 0);
///
/// val.with_mut(|v| *v = 1);
/// ```
@ -269,7 +269,7 @@ impl<T: Clone> UseState<T> {
/// # Examples
///
/// ```rust, ignore
/// let val = use_state(&cx, || 0);
/// let val = use_state(cx, || 0);
///
/// *val.make_mut() += 1;
/// ```
@ -448,7 +448,7 @@ impl<T: Div<Output = T> + Copy> std::ops::DivAssign<T> for UseState<T> {
fn api_makes_sense() {
#[allow(unused)]
fn app(cx: Scope) -> Element {
let val = use_state(&cx, || 0);
let val = use_state(cx, || 0);
val.set(0);
val.modify(|v| v + 1);

4
packages/interpreter/src/bindings.rs
View File

@ -2,7 +2,7 @@
use js_sys::Function;
use wasm_bindgen::prelude::*;
use web_sys::{Element, Node};
use web_sys::Element;
#[wasm_bindgen(module = "/src/interpreter.js")]
extern "C" {
@ -18,7 +18,7 @@ extern "C" {
pub fn MountToRoot(this: &Interpreter);
#[wasm_bindgen(method)]
pub fn AppendChildren(this: &Interpreter, m: u32);
pub fn AppendChildren(this: &Interpreter, m: u32, id: u32);
#[wasm_bindgen(method)]
pub fn AssignId(this: &Interpreter, path: &[u8], id: u32);

2
packages/liveview/README.md
View File

@ -40,7 +40,7 @@ async fn order_shoes(mut req: WebsocketRequest) -> Response {
}
fn App(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx!(
button { onclick: move |_| count += 1, "Incr" }
button { onclick: move |_| count -= 1, "Decr" }

4
packages/liveview/src/events.rs
View File

@ -6,7 +6,7 @@ use std::any::Any;
use std::sync::Arc;
use dioxus_core::ElementId;
use dioxus_html::event_bubbles;
// use dioxus_html::event_bubbles;
use dioxus_html::events::*;
#[derive(serde::Serialize, serde::Deserialize)]
@ -29,7 +29,7 @@ struct ImEvent {
contents: serde_json::Value,
}
pub fn trigger_from_serialized(val: serde_json::Value) -> () {
pub fn trigger_from_serialized(_val: serde_json::Value) {
todo!()
// let ImEvent {
// event,

2
packages/router/examples/simple.rs
View File

@ -36,7 +36,7 @@ fn BlogList(cx: Scope) -> Element {
}
fn BlogPost(cx: Scope) -> Element {
let id = use_route(&cx).segment("id")?;
let id = use_route(cx).segment("id")?;
log::trace!("rendering blog post {}", id);

2
packages/router/tests/web_router.rs
View File

@ -47,7 +47,7 @@ fn simple_test() {
}
fn BlogPost(cx: Scope) -> Element {
let _id = use_route(&cx).parse_segment::<usize>("id")?;
let _id = use_route(cx).parse_segment::<usize>("id")?;
cx.render(rsx! {
div {

6
packages/router/usage.md
View File

@ -109,7 +109,7 @@ For any route, you can get a handle the current route with the `use_route` hook.
```rust
fn Title(cx: Scope) -> Element {
let route = use_route(&cx);
let route = use_route(cx);
assert_eq!(route.segments(), &["dogs", "breeds", "yorkie", "hugo"]);
@ -130,7 +130,7 @@ Router {
}
fn BlogPost(cx: Scope) -> Element {
let route = use_route(&cx);
let route = use_route(cx);
match route.segment("post").and_then(parse) {
Some(post) => cx.render(rsx!{ div { "Post {post}" } })
@ -168,7 +168,7 @@ Listeners can also be attached downstream in your app with the `RouteListener` h
```rust
fn TitleCard(cx: Scope) -> Element {
let (title, set_title) = use_state(&cx, || "First");
let (title, set_title) = use_state(cx, || "First");
cx.render(rsx!{
h1 { "render {title}" }

6
packages/tui/benches/update.rs
View File

@ -41,7 +41,7 @@ struct BoxProps {
}
#[allow(non_snake_case)]
fn Box(cx: Scope<BoxProps>) -> Element {
let count = use_state(&cx, || 0);
let count = use_state(cx, || 0);
let x = cx.props.x * 2;
let y = cx.props.y * 2;
@ -70,8 +70,8 @@ struct GridProps {
#[allow(non_snake_case)]
fn Grid(cx: Scope<GridProps>) -> Element {
let size = cx.props.size;
let count = use_state(&cx, || 0);
let counts = use_ref(&cx, || vec![0; size * size]);
let count = use_state(cx, || 0);
let counts = use_ref(cx, || vec![0; size * size]);
let ctx: &TuiContext = cx.consume_context().unwrap();
if *count.get() + 1 >= (size * size) {

2
packages/tui/examples/tui_all_events.rs
View File

@ -27,7 +27,7 @@ enum Event {
const MAX_EVENTS: usize = 8;
fn app(cx: Scope) -> Element {
let events = use_ref(&cx, Vec::new);
let events = use_ref(cx, Vec::new);
let events_lock = events.read();
let first_index = events_lock.len().saturating_sub(MAX_EVENTS);

2
packages/tui/examples/tui_border.rs
View File

@ -5,7 +5,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let radius = use_state(&cx, || 0);
let radius = use_state(cx, || 0);
cx.render(rsx! {
div {

4
packages/tui/examples/tui_buttons.rs
View File

@ -13,8 +13,8 @@ struct ButtonProps {
#[allow(non_snake_case)]
fn Button(cx: Scope<ButtonProps>) -> Element {
let toggle = use_state(&cx, || false);
let hovered = use_state(&cx, || false);
let toggle = use_state(cx, || false);
let hovered = use_state(cx, || false);
let hue = cx.props.color_offset % 255;
let saturation = if *toggle.get() { 50 } else { 25 } + if *hovered.get() { 50 } else { 25 };

4
packages/tui/examples/tui_colorpicker.rs
View File

@ -8,8 +8,8 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let hue = use_state(&cx, || 0.0);
let brightness = use_state(&cx, || 0.0);
let hue = use_state(cx, || 0.0);
let brightness = use_state(cx, || 0.0);
let tui_query: &Query = cx.consume_context().unwrap();
// disable templates so that every node has an id and can be queried
cx.render(rsx! {

16
packages/tui/examples/tui_hover.rs
View File

@ -17,20 +17,20 @@ fn app(cx: Scope) -> Element {
127 * b
}
let q1_color = use_state(&cx, || [200; 3]);
let q2_color = use_state(&cx, || [200; 3]);
let q3_color = use_state(&cx, || [200; 3]);
let q4_color = use_state(&cx, || [200; 3]);
let q1_color = use_state(cx, || [200; 3]);
let q2_color = use_state(cx, || [200; 3]);
let q3_color = use_state(cx, || [200; 3]);
let q4_color = use_state(cx, || [200; 3]);
let q1_color_str = to_str(q1_color);
let q2_color_str = to_str(q2_color);
let q3_color_str = to_str(q3_color);
let q4_color_str = to_str(q4_color);
let page_coordinates = use_state(&cx, || "".to_string());
let element_coordinates = use_state(&cx, || "".to_string());
let buttons = use_state(&cx, || "".to_string());
let modifiers = use_state(&cx, || "".to_string());
let page_coordinates = use_state(cx, || "".to_string());
let element_coordinates = use_state(cx, || "".to_string());
let buttons = use_state(cx, || "".to_string());
let modifiers = use_state(cx, || "".to_string());
let update_data = move |event: Event<MouseData>| {
let mouse_data = event.inner();

4
packages/tui/examples/tui_task.rs
View File

@ -5,9 +5,9 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let count = use_state(&cx, || 0);
let count = use_state(cx, || 0);
use_future(&cx, (), move |_| {
use_future(cx, (), move |_| {
let count = count.to_owned();
let update = cx.schedule_update();
async move {

2
packages/tui/examples/tui_text.rs
View File

@ -5,7 +5,7 @@ fn main() {
}
fn app(cx: Scope) -> Element {
let alpha = use_state(&cx, || 100);
let alpha = use_state(cx, || 100);
cx.render(rsx! {
div {

4
packages/tui/src/query.rs
View File

@ -26,8 +26,8 @@ use crate::{layout_to_screen_space, TuiDom};
/// }
///
/// fn app(cx: Scope) -> Element {
/// let hue = use_state(&cx, || 0.0);
/// let brightness = use_state(&cx, || 0.0);
/// let hue = use_state(cx, || 0.0);
/// let brightness = use_state(cx, || 0.0);
/// let tui_query: Query = cx.consume_context().unwrap();
/// cx.render(rsx! {
/// div{

18
packages/tui/tests/events.rs
View File

@ -33,7 +33,7 @@ fn key_down() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {
@ -70,7 +70,7 @@ fn mouse_down() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {
@ -104,7 +104,7 @@ fn mouse_up() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {
@ -143,7 +143,7 @@ fn mouse_enter() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {
@ -182,7 +182,7 @@ fn mouse_exit() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {
@ -221,7 +221,7 @@ fn mouse_move() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {
@ -260,7 +260,7 @@ fn wheel() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {
@ -300,7 +300,7 @@ fn click() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {
@ -339,7 +339,7 @@ fn context_menu() {
dioxus_tui::launch_cfg(app, dioxus_tui::Config::new().with_headless());
fn app(cx: Scope) -> Element {
let render_count = use_state(&cx, || 0);
let render_count = use_state(cx, || 0);
let tui_ctx: TuiContext = cx.consume_context().unwrap();
let render_count_handle = render_count.clone();
cx.spawn(async move {

9
packages/web/src/dom.rs
View File

@ -7,13 +7,12 @@
//! - tests to ensure dyn_into works for various event types.
//! - Partial delegation?>
use dioxus_core::{ElementId, Mutation, Mutations, Template, TemplateAttribute, TemplateNode};
use dioxus_core::{Mutation, Template};
use dioxus_html::{event_bubbles, CompositionData, FormData};
use dioxus_interpreter_js::Interpreter;
use futures_channel::mpsc;
use js_sys::Function;
use std::{any::Any, rc::Rc};
use wasm_bindgen::{closure::Closure, JsCast, JsValue};
use wasm_bindgen::{closure::Closure, JsCast};
use web_sys::{Document, Element, Event};
use crate::Config;
@ -61,7 +60,7 @@ impl WebsysDom {
let i = &self.interpreter;
for edit in edits.drain(..) {
match edit {
AppendChildren { id, m } => i.AppendChildren(m as u32),
AppendChildren { id, m } => i.AppendChildren(m as u32, id.0 as u32),
AssignId { path, id } => i.AssignId(path, id.0 as u32),
CreatePlaceholder { id } => i.CreatePlaceholder(id.0 as u32),
CreateTextNode { value, id } => i.CreateTextNode(value.into(), id.0 as u32),
@ -81,7 +80,7 @@ impl WebsysDom {
i.SetBoolAttribute(id.0 as u32, name, value)
}
SetText { value, id } => i.SetText(id.0 as u32, value.into()),
NewEventListener { name, scope, id } => {
NewEventListener { name, id, .. } => {
self.interpreter.NewEventListener(
name,
id.0 as u32,

13
packages/web/src/lib.rs
View File

@ -53,15 +53,11 @@
// - Do the VDOM work during the idlecallback
// - Do DOM work in the next requestAnimationFrame callback
use std::time::Duration;
pub use crate::cfg::Config;
use crate::dom::virtual_event_from_websys_event;
pub use crate::util::use_eval;
use dioxus_core::{Element, ElementId, Scope, VirtualDom};
use futures_channel::mpsc::unbounded;
use futures_util::{pin_mut, FutureExt, StreamExt};
use gloo_timers::future::sleep;
mod cache;
mod cfg;
@ -181,7 +177,7 @@ pub async fn run_with_props<T: 'static>(root: fn(Scope<T>) -> Element, root_prop
wasm_bindgen::intern(s);
}
let should_hydrate = cfg.hydrate;
let _should_hydrate = cfg.hydrate;
let (tx, mut rx) = futures_channel::mpsc::unbounded();
@ -193,8 +189,6 @@ pub async fn run_with_props<T: 'static>(root: fn(Scope<T>) -> Element, root_prop
// } else {
let edits = dom.rebuild();
log::debug!("Initial edits {:#?}", edits);
websys_dom.load_templates(&edits.templates);
websys_dom.apply_edits(edits.edits);
@ -214,9 +208,8 @@ pub async fn run_with_props<T: 'static>(root: fn(Scope<T>) -> Element, root_prop
futures_util::select! {
_ = work => None,
new_template = hotreload_rx.next() => {
_new_template = hotreload_rx.next() => {
todo!("Implement hot reload");
None
}
evt = rx.next() => evt
}
@ -251,8 +244,6 @@ pub async fn run_with_props<T: 'static>(root: fn(Scope<T>) -> Element, root_prop
// wait for the animation frame to fire so we can apply our changes
work_loop.wait_for_raf().await;
log::debug!("edits {:#?}", edits);
websys_dom.load_templates(&edits.templates);
websys_dom.apply_edits(edits.edits);
}

2
translations/pt-br/README.md
View File

@ -56,7 +56,7 @@
```rust
fn app(cx: Scope) -> Element {
let mut count = use_state(&cx, || 0);
let mut count = use_state(cx, || 0);
cx.render(rsx! {
h1 { "High-Five counter: {count}" }