82 lines
2.4 KiB
Rust
82 lines
2.4 KiB
Rust
#![allow(non_snake_case)]
|
|
|
|
use dioxus::prelude::*;
|
|
use serde::{Deserialize, Serialize};
|
|
use wasm_bindgen::prelude::*;
|
|
|
|
static CSS: Asset = asset!("/assets/styles.css");
|
|
static TAURI_ICON: Asset = asset!("/assets/tauri.svg");
|
|
static DIOXUS_ICON: Asset = asset!("/assets/dioxus.png");
|
|
|
|
#[wasm_bindgen]
|
|
extern "C" {
|
|
#[wasm_bindgen(js_namespace = ["window", "__TAURI__", "core"])]
|
|
async fn invoke(cmd: &str, args: JsValue) -> JsValue;
|
|
}
|
|
|
|
#[derive(Serialize, Deserialize)]
|
|
struct GreetArgs<'a> {
|
|
name: &'a str,
|
|
}
|
|
|
|
pub fn App() -> Element {
|
|
let mut name = use_signal(|| String::new());
|
|
let mut greet_msg = use_signal(|| String::new());
|
|
|
|
// Wir geben dem Parameter einen expliziten Typ Option<()>
|
|
let greet = move |_: Option<()>| async move {
|
|
if name.read().is_empty() {
|
|
return;
|
|
}
|
|
|
|
let name_val = name.read();
|
|
let args = serde_wasm_bindgen::to_value(&GreetArgs { name: &*name_val }).unwrap();
|
|
|
|
let new_msg = invoke("greet", args).await.as_string().unwrap();
|
|
greet_msg.set(new_msg);
|
|
};
|
|
|
|
rsx! {
|
|
link { rel: "stylesheet", href: CSS }
|
|
main {
|
|
class: "container",
|
|
h1 { "Welcome to Tauri + Dioxus" }
|
|
|
|
div {
|
|
class: "row",
|
|
a { href: "https://tauri.app", target: "_blank",
|
|
img { src: TAURI_ICON, class: "logo tauri", alt: "Tauri logo" }
|
|
}
|
|
a { href: "https://dioxuslabs.com/", target: "_blank",
|
|
img { src: DIOXUS_ICON, class: "logo dioxus", alt: "Dioxus logo" }
|
|
}
|
|
}
|
|
|
|
p { "Click on the Tauri and Dioxus logos to learn more." }
|
|
|
|
div {
|
|
class: "row",
|
|
input {
|
|
id: "greet-input",
|
|
placeholder: "Enter a name...",
|
|
value: "{name}",
|
|
oninput: move |event| name.set(event.value()),
|
|
onkeydown: move |event| {
|
|
if event.key() == Key::Enter {
|
|
spawn(greet(None));
|
|
}
|
|
}
|
|
}
|
|
button {
|
|
onclick: move |_| {
|
|
spawn(greet(None));
|
|
},
|
|
"Greet"
|
|
}
|
|
}
|
|
|
|
p { "{greet_msg}" }
|
|
}
|
|
}
|
|
}
|