dragstart event isn't firing on chrome browser...I want to set the state to true on mouse drag event. so i add the document.addeventlistener('dragstart', this.dragstart) to the mousedown method like below,

ponentDidMount() {
    document.addEventListener('mousedown', this.mousedown);
}

ponentWillUnMount() {
    document.addEventListener('mousedown', this.mousedown);
}

dragstart = () => {
   console.log("dragstart");
}

mousedown = e => {
    console.log("mousedown"); 
    document.addEventListener('dragstart', this.dragstart);
}

Could someone help me with this. Thanks.

dragstart event isn't firing on chrome browser...I want to set the state to true on mouse drag event. so i add the document.addeventlistener('dragstart', this.dragstart) to the mousedown method like below,

ponentDidMount() {
    document.addEventListener('mousedown', this.mousedown);
}

ponentWillUnMount() {
    document.addEventListener('mousedown', this.mousedown);
}

dragstart = () => {
   console.log("dragstart");
}

mousedown = e => {
    console.log("mousedown"); 
    document.addEventListener('dragstart', this.dragstart);
}

Could someone help me with this. Thanks.

• javascript
• reactjs

• 1 What is render () { mousedown = e => {? It's not normal JSX construction. You should return ponents in render method – nucleartux Commented Mar 4, 2019 at 20:25
• edited the question. had a typo – stackoverflow_user Commented Mar 4, 2019 at 20:29

1 Answer 1

The ondragstart event occurs when the user starts to drag an element or text selection, but I don't think it will fire on a mousedown. As well, the element needs to be draggable.

<p draggable="true">