react中使用react-draggable实现拖拽,并解决在移动设备中使用拖拽后点击事件无效

1.通过npm安装react-draggable

npm  i react-draggable

2.引入react-draggable

import Draggable from 'react-draggable'

3.例如我们需要生成心愿卡片并且利用组件Draggable实现心愿卡片的拖拽

 <div className="wish-cards" >

       {wishCards.map((card, index) => (

         <Draggable key={card.id} defaultPosition={card.position} >

           <div key={index} className="wish-card not-drageble" >

          //生成的心愿卡片为背景图片

           <div className="image-container" style={ { backgroundImage: `url(${card.image})`,width:'100px',height:'100px',backgroundSize:'contain',marginTop:'10px' }} >

             <span>{card.wish}</span>

             <button style={ {float:'