- [<ReactSortable - list={list} - setList={setList} - ghostClass="dropArea" - filter=".ignore-elements" - draggable=".item" - handle=".dragHandle" - preventOnFilter={true} - animation="200" - easing="ease-out" - swap - onEnd={(evt) => handleSwap(evt.oldIndex, evt.newIndex)} - > - {list.map((key) => ( - <div key={key.id} className="item"> - <div className="col-12 py-2 ignore-elements"> - <div className="col-12"> - <div className="car-images-canvas-label d-flex align-items-center justify-content-end"> - <p className="m-0 pe-3 ">{key.label}</p> - </div> - </div> - </div> - <div className="col-12 py-3 px-4 d-flex"> - <div className="ignore-elements"> - <img - src={key.demoImg} - className="me-3 " - alt={`${key.demoImg}Icon`} - height={150} - width={150} - /> - </div> - <div className="dragHandle"> - <img - src={key.actualImg} - className="ms-3" - alt={`${key.demoImg}Icon`} - height={150} - width={150} - /> - </div> - </div> - </div> - ))} - `</ReactSortable>`] - - - - In this i want to add swapping functions to the actualimg but when i am adding item to actual image its not working