响应式信号

use_signal

创建响应式信号：

use euv::*;

let count: Signal<i32> = use_signal(|| 0);
let name: Signal<String> = use_signal(|| String::from("euv"));
let visible: Signal<bool> = use_signal(|| true);

读取值

let value: i32 = count.get();

// 安全读取（不会 panic）
let maybe_value: Option<i32> = count.try_get();

写入值

count.set(42);

// 值相同时不更新，返回 false
let updated: bool = count.try_set(42);

提示

set 内部做相等性检查，新值与当前值相同时不会触发更新和通知，避免不必要的重新渲染。

订阅变化

let count_for_sub: Signal<i32> = count;
count.subscribe(move || {
    let new_value: i32 = count_for_sub.get();
    web_sys::console::log_1(&format!("Count changed to: {}", new_value).into());
});

在 RSX 中使用

fn counter() -> VirtualNode {
    let count: Signal<i32> = use_signal(|| 0);
    let count_updater: Signal<i32> = count;
    rsx! {
        div {
            p {
                "Count: "
                count
            }
            button {
                onclick: move |_event: NativeEvent| {
                    let current: i32 = count_updater.get();
                    count_updater.set(current + 1);
                }
                "Increment"
            }
        }
    }
}

注意

Signal 不支持直接解引用，必须使用 .get() 和 .set() 方法，否则会 panic。

手动触发更新

trigger_update();

提示

同一同步代码块中的多次 set 会被合并为一次 DOM 更新，无需手动批量处理。

加载中...