Merge https://github.com/DioxusLabs/dioxus into jk/rsx-refactor
This commit is contained in:
commit
71d31556e5
7 files changed
+30
-20
No files matched your search
@@ -64,7 +64,7 @@ The most common hook you'll use for storing state is `use_state`. `use_state` pr
|
|||||||
|
|
||||||
```rust
|
```rust
|
||||||
fn App(cx: Scope)-> Element {
|
fn App(cx: Scope)-> Element {
|
||||||
let (post, set_post) = use_state(&cx, || {
|
let post = use_state(&cx, || {
|
||||||
PostData {
|
PostData {
|
||||||
id: Uuid::new_v4(),
|
id: Uuid::new_v4(),
|
||||||
score: 10,
|
score: 10,
|
||||||
@@ -112,11 +112,11 @@ For example, let's say we provide a button to generate a new post. Whenever the
|
|||||||
|
|
||||||
```rust
|
```rust
|
||||||
fn App(cx: Scope)-> Element {
|
fn App(cx: Scope)-> Element {
|
||||||
let (post, set_post) = use_state(&cx, || PostData::new());
|
let post = use_state(&cx, || PostData::new());
|
||||||
|
|
||||||
cx.render(rsx!{
|
cx.render(rsx!{
|
||||||
button {
|
button {
|
||||||
onclick: move |_| set_post(PostData::random())
|
onclick: move |_| post.set(PostData::random())
|
||||||
"Generate a random post"
|
"Generate a random post"
|
||||||
}
|
}
|
||||||
Post { props: &post }
|
Post { props: &post }
|
||||||
@@ -141,19 +141,19 @@ We can use tasks in our components to build a tiny stopwatch that ticks every se
|
|||||||
|
|
||||||
```rust
|
```rust
|
||||||
fn App(cx: Scope)-> Element {
|
fn App(cx: Scope)-> Element {
|
||||||
let (elapsed, set_elapsed) = use_state(&cx, || 0);
|
let elapsed = use_state(&cx, || 0);
|
||||||
|
|
||||||
use_future(&cx, || {
|
use_future(&cx, (), |()| {
|
||||||
to_owned![set_elapsed]; // explicitly capture this hook for use in async
|
to_owned![elapsed]; // explicitly capture this hook for use in async
|
||||||
async move {
|
async move {
|
||||||
loop {
|
loop {
|
||||||
TimeoutFuture::from_ms(1000).await;
|
gloo_timers::future::TimeoutFuture::new(1_000).await;
|
||||||
set_elapsed.modify(|i| i + 1)
|
elapsed.modify(|i| i + 1)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
rsx!(cx, div { "Current stopwatch time: {sec_elapsed}" })
|
rsx!(cx, div { "Current stopwatch time: {elapsed}" })
|
||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|||||||
@@ -11,7 +11,7 @@ Getting Set up with Dioxus-Desktop is quite easy. Make sure you have Rust and Ca
|
|||||||
|
|
||||||
```shell
|
```shell
|
||||||
$ cargo new --bin demo
|
$ cargo new --bin demo
|
||||||
$ cd app
|
$ cd demo
|
||||||
```
|
```
|
||||||
|
|
||||||
Add Dioxus with the `desktop` feature:
|
Add Dioxus with the `desktop` feature:
|
||||||
|
|||||||
@@ -33,7 +33,7 @@ impl<'a, const A: bool> FragmentBuilder<'a, A> {
|
|||||||
/// fn App(cx: Scope) -> Element {
|
/// fn App(cx: Scope) -> Element {
|
||||||
/// cx.render(rsx!{
|
/// cx.render(rsx!{
|
||||||
/// CustomCard {
|
/// CustomCard {
|
||||||
/// h1 {}2
|
/// h1 {}
|
||||||
/// p {}
|
/// p {}
|
||||||
/// }
|
/// }
|
||||||
/// })
|
/// })
|
||||||
|
|||||||
@@ -591,7 +591,7 @@ impl VirtualDom {
|
|||||||
///
|
///
|
||||||
/// *value.borrow_mut() = "goodbye";
|
/// *value.borrow_mut() = "goodbye";
|
||||||
///
|
///
|
||||||
/// let edits = dom.diff();
|
/// let edits = dom.hard_diff(ScopeId(0));
|
||||||
/// ```
|
/// ```
|
||||||
pub fn hard_diff(&mut self, scope_id: ScopeId) -> Mutations {
|
pub fn hard_diff(&mut self, scope_id: ScopeId) -> Mutations {
|
||||||
let mut diff_machine = DiffState::new(&self.scopes);
|
let mut diff_machine = DiffState::new(&self.scopes);
|
||||||
|
|||||||
@@ -212,7 +212,12 @@ pub(super) fn handler(
|
|||||||
log::warn!("Open print modal failed: {e}");
|
log::warn!("Open print modal failed: {e}");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
DevTool => webview.open_devtools(),
|
DevTool => {
|
||||||
|
#[cfg(debug_assertions)]
|
||||||
|
webview.open_devtools();
|
||||||
|
#[cfg(not(debug_assertions))]
|
||||||
|
log::warn!("Devtools are disabled in release builds");
|
||||||
|
}
|
||||||
|
|
||||||
Eval(code) => {
|
Eval(code) => {
|
||||||
if let Err(e) = webview.evaluate_script(code.as_str()) {
|
if let Err(e) = webview.evaluate_script(code.as_str()) {
|
||||||
|
|||||||
@@ -140,7 +140,9 @@ export class Interpreter {
|
|||||||
RemoveAttribute(root, field, ns) {
|
RemoveAttribute(root, field, ns) {
|
||||||
const name = field;
|
const name = field;
|
||||||
const node = this.nodes[root];
|
const node = this.nodes[root];
|
||||||
if (ns !== null || ns !== undefined) {
|
if (ns == "style") {
|
||||||
|
node.style.removeProperty(name);
|
||||||
|
} else if (ns !== null || ns !== undefined) {
|
||||||
node.removeAttributeNS(ns, name);
|
node.removeAttributeNS(ns, name);
|
||||||
} else if (name === "value") {
|
} else if (name === "value") {
|
||||||
node.value = "";
|
node.value = "";
|
||||||
|
|||||||
@@ -178,7 +178,7 @@ fn virtual_event_from_websys_event(
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
"keydown" | "keypress" | "keyup" => Arc::new(KeyboardData::from(event)),
|
"keydown" | "keypress" | "keyup" => Arc::new(KeyboardData::from(event)),
|
||||||
"focus" | "blur" => Arc::new(FocusData {}),
|
"focus" | "blur" | "focusout" | "focusin" => Arc::new(FocusData {}),
|
||||||
|
|
||||||
// todo: these handlers might get really slow if the input box gets large and allocation pressure is heavy
|
// todo: these handlers might get really slow if the input box gets large and allocation pressure is heavy
|
||||||
// don't have a good solution with the serialized event problem
|
// don't have a good solution with the serialized event problem
|
||||||
@@ -258,9 +258,9 @@ fn virtual_event_from_websys_event(
|
|||||||
|
|
||||||
Arc::new(FormData { value, values })
|
Arc::new(FormData { value, values })
|
||||||
}
|
}
|
||||||
"click" | "contextmenu" | "doubleclick" | "drag" | "dragend" | "dragenter" | "dragexit"
|
"click" | "contextmenu" | "dblclick" | "doubleclick" | "drag" | "dragend" | "dragenter"
|
||||||
| "dragleave" | "dragover" | "dragstart" | "drop" | "mousedown" | "mouseenter"
|
| "dragexit" | "dragleave" | "dragover" | "dragstart" | "drop" | "mousedown"
|
||||||
| "mouseleave" | "mousemove" | "mouseout" | "mouseover" | "mouseup" => {
|
| "mouseenter" | "mouseleave" | "mousemove" | "mouseout" | "mouseover" | "mouseup" => {
|
||||||
Arc::new(MouseData::from(event))
|
Arc::new(MouseData::from(event))
|
||||||
}
|
}
|
||||||
"pointerdown" | "pointermove" | "pointerup" | "pointercancel" | "gotpointercapture"
|
"pointerdown" | "pointermove" | "pointerup" | "pointercancel" | "gotpointercapture"
|
||||||
@@ -305,6 +305,8 @@ fn event_name_from_typ(typ: &str) -> &'static str {
|
|||||||
"keypress" => "keypress",
|
"keypress" => "keypress",
|
||||||
"keyup" => "keyup",
|
"keyup" => "keyup",
|
||||||
"focus" => "focus",
|
"focus" => "focus",
|
||||||
|
"focusout" => "focusout",
|
||||||
|
"focusin" => "focusin",
|
||||||
"blur" => "blur",
|
"blur" => "blur",
|
||||||
"change" => "change",
|
"change" => "change",
|
||||||
"input" => "input",
|
"input" => "input",
|
||||||
@@ -314,6 +316,7 @@ fn event_name_from_typ(typ: &str) -> &'static str {
|
|||||||
"click" => "click",
|
"click" => "click",
|
||||||
"contextmenu" => "contextmenu",
|
"contextmenu" => "contextmenu",
|
||||||
"doubleclick" => "doubleclick",
|
"doubleclick" => "doubleclick",
|
||||||
|
"dblclick" => "dblclick",
|
||||||
"drag" => "drag",
|
"drag" => "drag",
|
||||||
"dragend" => "dragend",
|
"dragend" => "dragend",
|
||||||
"dragenter" => "dragenter",
|
"dragenter" => "dragenter",
|
||||||
@@ -374,8 +377,8 @@ fn event_name_from_typ(typ: &str) -> &'static str {
|
|||||||
"volumechange" => "volumechange",
|
"volumechange" => "volumechange",
|
||||||
"waiting" => "waiting",
|
"waiting" => "waiting",
|
||||||
"toggle" => "toggle",
|
"toggle" => "toggle",
|
||||||
_ => {
|
a => {
|
||||||
panic!("unsupported event type")
|
panic!("unsupported event type {:?}", a);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Reference in new issue
Block a user