Skip to content

Commit 4c85bcf

Browse files
committed
awesome: arbitrary expressions excepted without braces
1 parent 1496102 commit 4c85bcf

40 files changed

+809
-751
lines changed

README.md

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,9 @@ If you know React, then you already know Dioxus.
7979
<tr>
8080
</table>
8181

82-
## Examples:
82+
83+
84+
## Examples Projects:
8385

8486
| File Navigator (Desktop) | WiFi scanner (Desktop) | TodoMVC (All platforms) | Ecommerce w/ Tailwind (Liveview) |
8587
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
@@ -88,6 +90,10 @@ If you know React, then you already know Dioxus.
8890

8991
See the awesome-dioxus page for a curated list of content in the Dioxus Ecosystem.
9092

93+
## Running examples locally
94+
95+
All local examples are built for the desktop renderer. This means you can simply clone this repo and call `cargo run --example EXAMPLE_NAME`. To run non-desktop examples, checkout the example projects shown above.
96+
9197
## Why Dioxus and why Rust?
9298

9399
TypeScript is a fantastic addition to JavaScript, but it's still fundamentally JavaScript. TS code runs slightly slower, has tons of configuration options, and not every package is properly typed.

examples/README.md

Lines changed: 8 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -42,14 +42,6 @@ These examples are not necessarily meant to be run, but rather serve as a refere
4242
| [Complete rsx reference](./rsx_usage.rs) | A complete reference for all rsx! usage ||
4343
| [Event Listeners](./listener.rs) | Attach closures to events on elements ||
4444

45-
These web-specific examples must be run with `dioxus-cli` using `dioxus develop --example XYZ`
46-
47-
| Example | What it does |
48-
| ------- | ------------ |
49-
| asd | this does |
50-
| asd | this does |
51-
52-
5345

5446
## Show me some examples!
5547

@@ -75,9 +67,9 @@ fn Toggle(cx: Scope<ToggleProps>) -> Element {
7567
let mut toggled = use_state(&cx, || false);
7668
cx.render(rsx!{
7769
div {
78-
{&cx.props.children}
70+
&cx.props.children
7971
button { onclick: move |_| toggled.set(true),
80-
{toggled.and_then(|| "On").or_else(|| "Off")}
72+
toggled.and_then(|| "On").or_else(|| "Off")
8173
}
8274
}
8375
})
@@ -112,8 +104,8 @@ fn App(cx: Scope) -> Element {
112104

113105
if should_show {
114106
cx.render(rsx!(
115-
{title}
116-
ul { {list} }
107+
title,
108+
ul { list }
117109
))
118110
} else {
119111
None
@@ -169,10 +161,10 @@ enum Route {
169161
fn App(cx: Scope) -> Element {
170162
let route = use_router(cx, Route::parse);
171163
cx.render(rsx!(div {
172-
{match route {
164+
match route {
173165
Route::Home => rsx!( Home {} ),
174166
Route::Post(id) => rsx!( Post { id: id })
175-
}}
167+
}
176168
}))
177169
}
178170
```
@@ -187,8 +179,8 @@ fn App(cx: Scope) -> Element {
187179

188180
cx.render(rsx!{
189181
div {
190-
"One doggo coming right up:"
191-
{doggo}
182+
"One doggo coming right up:",
183+
doggo
192184
}
193185
})
194186
}

examples/async.rs

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -26,20 +26,18 @@ fn app(cx: Scope) -> Element {
2626

2727
rsx!(cx, div {
2828
h1 {"count is {count}"}
29-
button {
29+
button { onclick: move |_| task.stop(),
3030
"Stop counting"
31-
onclick: move |_| task.stop()
3231
}
33-
button {
32+
button { onclick: move |_| task.resume(),
3433
"Start counting"
35-
onclick: move |_| task.resume()
3634
}
3735
button {
38-
"Switch counting direcion"
3936
onclick: move |_| {
4037
*direction.modify() *= -1;
4138
task.restart();
42-
}
39+
},
40+
"Switch counting direcion"
4341
}
4442
})
4543
}

examples/borrowed.rs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ fn main() {
2121
}
2222

2323
fn App(cx: Scope) -> Element {
24-
let text: &mut Vec<String> = cx.use_hook(|_| vec![String::from("abc=def")], |f| f);
24+
let text = cx.use_hook(|_| vec![String::from("abc=def")], |f| f);
2525

2626
let first = text.get_mut(0).unwrap();
2727

examples/calculator.rs

Lines changed: 53 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,9 @@ fn app(cx: Scope) -> Element {
2424
let input_digit = move |num: u8| display_value.modify().push_str(num.to_string().as_str());
2525

2626
cx.render(rsx!(
27-
div { class: "calculator",
27+
style { [include_str!("./assets/calculator.css")] }
28+
div {
29+
class: "calculator",
2830
onkeydown: move |evt| match evt.key_code {
2931
KeyCode::Add => operator.set(Some("+")),
3032
KeyCode::Subtract => operator.set(Some("-")),
@@ -46,23 +48,22 @@ fn app(cx: Scope) -> Element {
4648
}
4749
}
4850
_ => {}
49-
}
50-
div { class: "calculator-display", {[cur_val.separated_string()]} }
51-
div { class: "input-keys"
52-
div { class: "function-keys"
51+
},
52+
div { class: "calculator-display", [cur_val.separated_string()] }
53+
div { class: "input-keys",
54+
div { class: "function-keys",
5355
CalculatorKey {
54-
{[if display_value == "0" { "C" } else { "AC" }]}
5556
name: "key-clear",
5657
onclick: move |_| {
5758
display_value.set("0".to_string());
5859
if display_value != "0" {
5960
operator.set(None);
6061
cur_val.set(0.0);
6162
}
62-
}
63+
},
64+
[if display_value == "0" { "C" } else { "AC" }]
6365
}
6466
CalculatorKey {
65-
"±"
6667
name: "key-sign",
6768
onclick: move |_| {
6869
if display_value.starts_with("-") {
@@ -71,28 +72,53 @@ fn app(cx: Scope) -> Element {
7172
display_value.set(format!("-{}", *display_value))
7273
}
7374
},
75+
"±"
7476
}
7577
CalculatorKey {
76-
"%"
77-
onclick: {toggle_percent}
78+
onclick: toggle_percent,
7879
name: "key-percent",
80+
"%"
7981
}
8082
}
81-
div { class: "digit-keys"
82-
CalculatorKey { name: "key-0", onclick: move |_| input_digit(0), "0" }
83-
CalculatorKey { name: "key-dot", onclick: move |_| display_value.modify().push_str("."), "●" }
84-
85-
{(1..9).map(|k| rsx!{
86-
CalculatorKey { key: "{k}", name: "key-{k}", onclick: move |_| input_digit(k), "{k}" }
87-
})}
83+
div { class: "digit-keys",
84+
CalculatorKey { name: "key-0", onclick: move |_| input_digit(0),
85+
"0"
86+
}
87+
CalculatorKey { name: "key-dot", onclick: move |_| display_value.modify().push_str("."),
88+
"●"
89+
}
90+
(1..9).map(|k| rsx!{
91+
CalculatorKey {
92+
key: "{k}",
93+
name: "key-{k}",
94+
onclick: move |_| input_digit(k),
95+
"{k}"
96+
}
97+
}),
8898
}
89-
div { class: "operator-keys"
90-
CalculatorKey { name: "key-divide", onclick: move |_| operator.set(Some("/")) "÷" }
91-
CalculatorKey { name: "key-multiply", onclick: move |_| operator.set(Some("*")) "×" }
92-
CalculatorKey { name: "key-subtract", onclick: move |_| operator.set(Some("-")) "−" }
93-
CalculatorKey { name: "key-add", onclick: move |_| operator.set(Some("+")) "+" }
99+
100+
div { class: "operator-keys",
101+
CalculatorKey {
102+
name: "key-divide",
103+
onclick: move |_| operator.set(Some("/")),
104+
"÷"
105+
}
106+
CalculatorKey {
107+
name: "key-multiply",
108+
onclick: move |_| operator.set(Some("*")),
109+
"×"
110+
}
111+
CalculatorKey {
112+
name: "key-subtract",
113+
onclick: move |_| operator.set(Some("-")),
114+
"−"
115+
}
116+
CalculatorKey {
117+
name: "key-add",
118+
onclick: move |_| operator.set(Some("+")),
119+
"+"
120+
}
94121
CalculatorKey {
95-
"="
96122
name: "key-equals",
97123
onclick: move |_| {
98124
if let Some(op) = operator.as_ref() {
@@ -109,6 +135,7 @@ fn app(cx: Scope) -> Element {
109135
operator.set(None);
110136
}
111137
},
138+
"="
112139
}
113140
}
114141
}
@@ -125,9 +152,9 @@ fn CalculatorKey<'a>(
125152
) -> Element {
126153
cx.render(rsx! {
127154
button {
128-
class: "calculator-key {name}"
129-
onclick: {onclick}
130-
{children}
155+
class: "calculator-key {name}",
156+
onclick: onclick,
157+
children
131158
}
132159
})
133160
}

examples/core_reference/iterators.rs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,11 @@ pub static Example: Component = |cx| {
2020
li { onclick: move |_| example_data.set(f)
2121
"ID: {f}"
2222
ul {
23-
{(0..10).map(|k| rsx!{
23+
(0..10).map(|k| rsx!{
2424
li {
2525
"Sub iterator: {f}.{k}"
2626
}
27-
})}
27+
})
2828
}
2929
}
3030
}

0 commit comments

Comments
 (0)