2

i have implemented react dnd in my application but i cant scroll to the top of page while dragging a component how can i solve this problem ? thanks in advance

return (
    <div ref={connectDragSource} style={{margin:"10px",opacity:opacity}} key={item.id} >
       <Card xl={6} lg={12} md={12}>  
            <Col>
                <CardHeader>{item.name}
                <FaEdit
                  style={{
                    marginLeft: parseInt(item.width),
                }}
                onClick={this.editing}
                />
                </CardHeader>
                <CardBody>
                <Line data={genLineData(item,{ fill: false })} 
                width={parseInt(item.width)} height={parseInt(item.height)}  
                options={{
                  legend: {
                      display: false,
                  },
                  }}
                />
                </CardBody>
            </Col>
        </Card>
        <ModalEditChart  editmod={editmod} item={item}/>                 
    </div>
)
Mar Yem
  • 21
  • 2
  • It will be easier to get an answer if your code sample included more than just the component. Are you using a library, mention it. is this component's behaviour influenced by another, show it here too. – Femi Oni May 10 '19 at 17:23

1 Answers1

0

One possible solution is to create invisible components at the top and bottom that trigger scrolling when the source item hovers over them.

Dan Cron
  • 1,105
  • 12
  • 24