修复 Footer 组件滚动监听器未正确清理的问题
This commit is contained in:
parent
6ddc02a815
commit
a58e0f4e3b
@ -1,10 +1,25 @@
|
|||||||
use dioxus::prelude::*;
|
use dioxus::prelude::*;
|
||||||
|
use std::cell::RefCell;
|
||||||
|
use std::rc::Rc;
|
||||||
|
|
||||||
#[component]
|
#[component]
|
||||||
#[allow(unused_mut)]
|
#[allow(unused_mut)]
|
||||||
pub fn Footer() -> Element {
|
pub fn Footer() -> Element {
|
||||||
let mut visible = use_signal(|| false);
|
let mut visible = use_signal(|| false);
|
||||||
|
|
||||||
|
#[cfg(target_arch = "wasm32")]
|
||||||
|
let listener_state = use_hook(|| {
|
||||||
|
Rc::new(RefCell::new(
|
||||||
|
None::<(wasm_bindgen::prelude::Closure<dyn FnMut()>, web_sys::Window)>,
|
||||||
|
))
|
||||||
|
});
|
||||||
|
|
||||||
|
#[cfg(not(target_arch = "wasm32"))]
|
||||||
|
let _listener_state = use_hook(|| Rc::new(RefCell::new(None::<()>)));
|
||||||
|
|
||||||
|
#[cfg(target_arch = "wasm32")]
|
||||||
|
let listener_state_for_effect = listener_state.clone();
|
||||||
|
|
||||||
use_effect(move || {
|
use_effect(move || {
|
||||||
#[cfg(target_arch = "wasm32")]
|
#[cfg(target_arch = "wasm32")]
|
||||||
{
|
{
|
||||||
@ -36,11 +51,21 @@ pub fn Footer() -> Element {
|
|||||||
let scroll_y = window.scroll_y().unwrap_or(0.0);
|
let scroll_y = window.scroll_y().unwrap_or(0.0);
|
||||||
visible.set(scroll_y > threshold);
|
visible.set(scroll_y > threshold);
|
||||||
|
|
||||||
closure.forget();
|
*listener_state_for_effect.borrow_mut() = Some((closure, window));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
#[cfg(target_arch = "wasm32")]
|
||||||
|
use_drop(move || {
|
||||||
|
if let Some((closure, window)) = listener_state.borrow_mut().take() {
|
||||||
|
let _ = window.remove_event_listener_with_callback(
|
||||||
|
"scroll",
|
||||||
|
wasm_bindgen::JsCast::unchecked_ref(closure.as_ref()),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
let link_class = use_memo(move || {
|
let link_class = use_memo(move || {
|
||||||
let base = "p-2 rounded-full cursor-pointer hover:opacity-80 transition-all duration-300 text-gray-600 dark:text-gray-300";
|
let base = "p-2 rounded-full cursor-pointer hover:opacity-80 transition-all duration-300 text-gray-600 dark:text-gray-300";
|
||||||
if visible() {
|
if visible() {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user