codify "platform" into resolution logic, server-fn/fullstack overhaul (#4596)
overhaul dioxus fullstack using a new implementation of server_fn This PR is a complete rewrite of dioxus fullstack designed to improve compatibility with axum and to fix a number of compilation errors based on feature flag unification plumbing through macros.
This commit is contained in:
1 parent
8421c3aef0
commit
f2b1c6d97f
424 files changed
+17284
-6624
No files matched your search
@@ -0,0 +1,59 @@
|
||||
//! Scroll elements using their MountedData
|
||||
//!
|
||||
//! Dioxus exposes a few helpful APIs around elements (mimicking the DOM APIs) to allow you to interact with elements
|
||||
//! across the renderers. This includes scrolling, reading dimensions, and more.
|
||||
//!
|
||||
//! In this example we demonstrate how to scroll to a given y offset of the scrollable parent using the `scroll` method on the `MountedData`
|
||||
|
||||
use dioxus::html::geometry::PixelsVector2D;
|
||||
use dioxus::prelude::*;
|
||||
|
||||
fn main() {
|
||||
dioxus::launch(app);
|
||||
}
|
||||
|
||||
fn app() -> Element {
|
||||
rsx! {
|
||||
ScrollToCoordinates {}
|
||||
ScrollToCoordinates {}
|
||||
}
|
||||
}
|
||||
|
||||
#[component]
|
||||
fn ScrollToCoordinates() -> Element {
|
||||
let mut element = use_signal(|| None);
|
||||
|
||||
rsx! {
|
||||
div { border: "1px solid black", position: "relative",
|
||||
|
||||
div {
|
||||
height: "300px",
|
||||
overflow_y: "auto",
|
||||
|
||||
onmounted: move |event| element.set(Some(event.data())),
|
||||
|
||||
for i in 0..100 {
|
||||
div { height: "20px", "Item {i}" }
|
||||
}
|
||||
}
|
||||
|
||||
div { position: "absolute", top: 0, right: 0,
|
||||
input {
|
||||
r#type: "number",
|
||||
min: "0",
|
||||
max: "99",
|
||||
oninput: move |event| async move {
|
||||
if let Some(ul) = element.cloned() {
|
||||
let data = event.data();
|
||||
if let Ok(value) = data.parsed::<f64>() {
|
||||
ul.scroll(PixelsVector2D::new(0.0, 20.0 * value), ScrollBehavior::Smooth)
|
||||
.await
|
||||
.unwrap();
|
||||
}
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user