dioxus_element_plug/components/
backtop.rs

1use dioxus::prelude::*;
2
3/// Backtop props
4#[derive(Props, Clone, PartialEq)]
5pub struct BacktopProps {
6    #[props(default)]
7    pub children: Option<Element>,
8
9    /// Target element to scroll back to
10    #[props(default)]
11    pub target: Option<String>,
12
13    /// Visibility height
14    #[props(default = 200)]
15    pub visibility_height: u32,
16
17    /// Right position
18    #[props(default = 40)]
19    pub right: u32,
20
21    /// Bottom position
22    #[props(default = 40)]
23    pub bottom: u32,
24
25    #[props(default)]
26    pub on_click: Option<EventHandler<()>>,
27
28    #[props(default)]
29    pub class: Option<String>,
30}
31
32/// Backtop component for scroll-to-top button
33#[component]
34pub fn Backtop(props: BacktopProps) -> Element {
35    let mut class_names = vec!["el-backtop".to_string()];
36    if let Some(ref c) = props.class { class_names.push(c.clone()); }
37
38    rsx! {
39        div {
40            class: "{class_names.join(\" \")}",
41            style: "position: fixed; right: {props.right}px; bottom: {props.bottom}px; z-index: 1000; cursor: pointer;",
42            onclick: move |_| {
43                if let Some(handler) = props.on_click {
44                    handler.call(());
45                }
46            },
47            if props.children.is_some() {
48                {props.children}
49            } else {
50                i { class: "el-icon-caret-top" }
51            }
52        }
53    }
54}
dioxus_element_plug/components/backtop.rs

dioxus_element_plug/components/
backtop.rs
