rbd(react-beautiful-dnd)-拖动时copy一个新的元素占据原来的位置

Sponge_bob_

已于 2023-03-26 18:58:46 修改

阅读量620

点赞数

文章标签： react.js javascript 前端

于 2023-03-26 18:53:50 首次发布

本文链接：https://blog.csdn.net/Sponge_bob_/article/details/129782735

版权

import React, {
    useState } from "react";
import styled from "styled-components";
import {
   
  DragDropContext,
  Draggable,
  DraggableProvided,
  DraggableRubric,
  DraggableStateSnapshot,
  DragStart,
  DragUpdate,
  Droppable,
  DropResult,
  ResponderProvided,
} from "react-beautiful-dnd";
import "./styles.css";

interface IItem {
   
  id: string;
  label: string;
}

export const DndForm: React.FC = () => {
   
  const COLLECTION: IItem[] = [
    {
    id: "1", label: "Apple" },
    {
    id: "2", label: "Banana" },
    {
    id: "3", label: "orange" },
  ];
  const [items, setItems] = useState<IItem[]>(COLLECTION);
  const [enabled, setEnabled] = React.useState(false);
  React.useEffect(() => {
   
    const animation = requestAnimationFrame(() => setEnabled(true))