已关闭，此问题需要details or clarity。目前不接受答复。
**想改善这个问题吗？**通过editing this post添加详细信息并澄清问题。

18小时前关闭
这篇文章是编辑并提交审查17小时前.
Improve this question
我有一个视频的拖动球线。我必须在react js中实现这个功能。球是可拖动的，在释放球杆到其位置后，球移动穿过线

，而不是移动到其原始位置。
我尝试了多种代码和方法，但没有一个能按需工作。我需要帮助，以创造这样的React功能，请帮助我，如果有人知道如何做到这一点。

const Ball = ({ color, onDragStart, onDragOver, onDrop }) => (
       <div
         className="ball"
         draggable
         onDragStart={onDragStart}
         onDragOver={onDragOver}
         onDrop={onDrop}
         style={{ backgroundColor: color }}
      />
     );

     import React, { useState } from 'react';
     import Ball from './Ball';

     const colors = ['red', 'blue', 'green', 'yellow'];

     const Line = () => {
     const [balls, setBalls] = useState(colors);

     const onDragStart = (e, index) => {
     e.dataTransfer.setData('index', index);
      };

      const onDragOver = (e) => {
      e.preventDefault();
      };

      const onDrop = (e, index) => {
    const droppedIndex = e.dataTransfer.getData('index');
    const newBalls = [...balls];
    newBalls.splice(droppedIndex, 1);
    newBalls.splice(index, 0, colors[droppedIndex]);
    setBalls(newBalls);
  };

  return (
    <div className="line">
      {balls.map((color, index) => (
        <Ball
          key={index}
          color={color}
          onDragStart={(e) => onDragStart(e, index)}
          onDragOver={onDragOver}
          onDrop={(e) => onDrop(e, index)}
        />
      ))}
    </div>
  );
};

这段代码是不为我工作plz给予我一个适当的答案的问题，不要关闭问题或审查负面.