Dioxus框架中移动渲染器特定(API)

57 阅读1分钟

移动设备

本指南将涵盖特定于Dioxus移动渲染器的概念。

运行JavaScript

Dioxus在浏览器API上提供了一些符合人体工程学的包装器,但在某些情况下,你可能需要访问Dioxus没有暴露的浏览器API的部分。

对于这些情况,Dioxus桌面暴露了use_eval钩子,允许你在WebView中运行原始JavaScript:

use dioxus::prelude::*;

fn main() {
    launch(app);
}

fn app() -> Element {
    // 你可以创建任意多的eval实例
    let mut eval = eval(
        r#"
        // 你可以使用dioxus.send函数从JavaScript向Rust发送消息
        dioxus.send("Hi from JS!");
        // 你可以使用dioxus.recv函数从Rust向JavaScript接收消息
        let msg = await dioxus.recv();
        console.log(msg);
        "#,
    );

    // 你可以使用send方法向JavaScript发送消息
    eval.send("Hi from Rust!".into()).unwrap();

    let future = use_resource(move || {
        to_owned![eval];
        async move {
            // 你可以使用recv方法从JavaScript接收任何消息
            eval.recv().await.unwrap()
        }
    });

    match future.read_unchecked().as_ref() {
        Some(v) => rsx! { p { "{v}" } },
        _ => rsx! { p { "hello" } },
    }
}

自定义资源

你可以在Dioxus移动中链接到本地资源,而不是使用URL:

use dioxus::prelude::*;
use manganis::mg;

fn main() {
    launch(app);
}

fn app() -> Element {
    rsx! {
        div { img { src: mg!(file("public/static/scanner.png")) } }
    }
}

与Wry集成

在需要对窗口进行更底层控制的情况下,你可以使用通过桌面配置和use_window钩子暴露的wry API。

img