Hey i'm Creating a Calendar using reactjs with Custom Drag and Drop . I'm facing issue on Ipad and Touch mobiles . my code is working perfect on desktop but if I open chrome dev tool and change screen resolution to 768px tablet . my events doesn't work in it either. please Help i've used cursor:pointer and e.stopPropagation() in parent event and child event both but didn't work . i use onTouchStart={this.handleTouchStart}
here is the code i'm using The parent Event is
Sectiondoubletap(e) {
debugger
var now = new Date().getTime();
var timesince = now - this.state.mylatesttap;
if((timesince < 300) && (timesince > 0)){
// double tap checking
this._handleDoubleClickSpaltenBody(e)
console.log("Sectiondoubletap worked")
}
this.state.mylatesttap = new Date().getTime();
}The child event is
handleTouchStart(ev) {
ev.stopPropagation();
console.log("handleTouchStart");
var now = new Date().getTime();
var timesince = now - this.state.mylatesttap;
// checking double tap
if((timesince < 300) && (timesince > 0)){
// double tap checking
this._handleDoubleClickItem(ev)
console.log("Appoinmentdoubletap worked")
}else{
this.handleDrag(ev);
}
this.state.mylatesttap = new Date().getTime();
}Did you try to change
e.stopPropagation()
by
e.stopImmediatePropagation()