DioxusLabs / DioxusLabs/dioxus

ondragover event is unresponsive.

Open
#1,504 13 comments 0 reactions 0 assignees View on GitHub
blocked bug desktop
Dominant language
Rust
Stars
39.1k
Forks
1.9k
Avg merge
4d 10h
Merged PRs (30d)
4

Description

ondragover event not firing when it needs to.

the ondragover event should be called when a draggable element gets dragged over the tag with the ondragover event listener. I am having trouble getting any of the ondrag events except for ondragstart to fire when they would in a normal web browser code. Is drag and drop possible in dioxus, I roughly translated this code from reactjs code into rust, I dont undestand why it is not working. I excpect it to println that an element is in the drop zone, but instead it does nothing. Is this a user error or is this functionality not built in to dioxus as of right now?

```rust
use dioxus::prelude::*;

fn main() {
dioxus_desktop::launch(app);
}

fn app(cx:Scope) -> Element {
let questions = use_ref(cx,||{Vec::::new()});
let data_transfer = use_state(cx, || {"".to_string()});

cx.render(rsx!(
main {
style: "background-color: blue; height:100%",
"DRAG DEMO",

div {
style: r#"
background-color: red;
width: 50%;
height:40%;
"#,
"DRAGGABLE ELEMENTS",

div {
draggable: true,
ondragstart: move |ev| {
println!("{:?}",ev);
data_transfer.set("ITEM1".to_string());
},
"ITEM1"
},

div {
draggable: true,
ondragstart: move |ev| {
println!("{:?}",ev);
data_transfer.set("ITEM2".to_string());
},
"ITEM2"
},

},

div {
style: r#"
background-color: green;
width: 50%;
height: 80%;
"#,
prevent_default: "ondragover",
ondragover: move |_ev| {
_ev.stop_propagation();
println!("IN DROP ZONE");
},
ondragenter: move |_ev| {
println!("ITEM ENTERED DROP ZONE");
},
ondrop: move |_ev| {
println!("ITEM DROPPED");
let question = data_transfer.get();
questions.with_mut(|list| list.push(question.to_owned()));
},
"DROP ZONE",
questions.read().iter().map(|question| {
rsx!( div {"{question }"})
})
}

}
))
}
```

**Environment:**
- Dioxus version: 0.4.0
- Rust version: 1.7.1
- OS info: Linux Mint 21.2
- App platform: desktop

**Questionnaire**

- [X] I'm interested in fixing this myself but don't know where to start
- [ ] I would like to fix and I have a solution
- [ ] I don't have time to fix this right now, but maybe later

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.