使用拼接函数时,如何在数组中移动javascript整个对象?(反应.js)

我正在 React 中使用拖放交互.js。我正在使用拼接函数对“行”数组进行重新排序,该函数在拖动完成后使用下面的 onDragEnd 函数调用:


onDragEnd = (result) => {

    const { destination, source, draggableId, type } = result;

    if (!destination) {

        return;

    }

    if (

        destination.draggableId === source.droppableId &&

        destination.index === source.index

    ) {

        return;

    }


    if (type === "row") {

        const newRowOrder = Array.from(**this.state.currentRows**);

        newRowOrder.splice(source.index, 1);

        newRowOrder.splice(destination.index, 0, **draggableId**);


        const newState = {

            ...this.state,

            currentRows: newRowOrder,

        };


        this.setState(newState);

    }

};

在 onDragEnd 函数称为 currentRow 状态之前,如下所示:currentRow 状态在 onDragEnd 之前


当调用该函数时,拼接函数起作用(我认为),但它不会移动数组中的整个对象,而只是移动ID。拼接函数中使用的拖动 Id 是需要移动的对象的 ID。


在 onDragEnd 函数被调用后,currentRow 状态如下所示:currentRow 状态在 onDragEnd 之后


是否可以将整个对象移动到新索引?


侃侃无极
浏览 149回答 1
1回答

摇曳的蔷薇

我认为您只是插入dragableId,您可以使用该函数找到整个对象并插入整个对象newRowOrder.splice(destination.index, 0, **draggableId**);Array.findonDragEnd = (result) => {    const { destination, source, draggableId, type } = result;    if (!destination) {        return;    }    if (        destination.draggableId === source.droppableId &&        destination.index === source.index    ) {        return;    }    if (type === "row") {        const draggableRow = this.state.currentRows.find(row => row.id === draggableId);        const newRowOrder = Array.from(this.state.currentRows);        newRowOrder.splice(source.index, 1);        newRowOrder.splice(destination.index, 0, draggableRow);        const newState = {            ...this.state,            currentRows: newRowOrder,        };        this.setState(newState);    }}
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript