pub fn use_drop<'hook>(
node: NodeRef,
) -> impl 'hook + Hook<Output = UseDropHandle>Expand description
This hook tracks file, link and copy-paste drops.
§Example
use yew_hooks::prelude::*;
#[function_component(UseDrop)]
fn drop() -> Html {
let node = use_node_ref();
let state = use_drop(node.clone());
html! {
<div ref={node}>
<p><b>{ " Files: " }</b></p>
{if let Some(files) = &*state.files {
html! {for file in files.iter() {
<p> { file.name() }</p>
} }
} else {
html! {}
}}
<p><b>{ " Text: " }</b></p>
{if let Some(text) = &*state.text {
html! {<p>{ text }</p>}
} else {
html! {}
}}
<p><b>{ " Uri: " }</b></p>
{if let Some(uri) = &*state.uri {
html! {<p>{ uri }</p>}
} else {
html! {}
}}
<p>
{ "Try to drag & drop or copy & paste something here, e.g. files, links or text" }
</p>
</div>
}
}§Note
When used in function components and hooks, this hook is equivalent to:
/// This hook tracks file, link and copy-paste drops.
///
/// # Example
///
/// ```rust
/// # use yew::prelude::*;
/// #
/// use yew_hooks::prelude::*;
///
/// #[function_component(UseDrop)]
/// fn drop() -> Html {
/// let node = use_node_ref();
/// let state = use_drop(node.clone());
///
/// html! {
/// <div ref={node}>
/// <p><b>{ " Files: " }</b></p>
/// {if let Some(files) = &*state.files {
/// html! {for file in files.iter() {
/// <p> { file.name() }</p>
/// } }
/// } else {
/// html! {}
/// }}
/// <p><b>{ " Text: " }</b></p>
/// {if let Some(text) = &*state.text {
/// html! {<p>{ text }</p>}
/// } else {
/// html! {}
/// }}
/// <p><b>{ " Uri: " }</b></p>
/// {if let Some(uri) = &*state.uri {
/// html! {<p>{ uri }</p>}
/// } else {
/// html! {}
/// }}
/// <p>
/// { "Try to drag & drop or copy & paste something here, e.g. files, links or text" }
/// </p>
/// </div>
/// }
/// }
/// ```
pub fn use_drop(node: NodeRef) -> UseDropHandle {
/* implementation omitted */
}