リクエストされたReactコンポーネントのコード・スニペットです：

```javascript
import React, { useState } from 'react';

const App = () => {
  const [items1, setItems1] = useState(['Item 1', 'Item 2', 'Item 3']);
  const [items2, setItems2] = useState([]);

  const onDragStart = (e, index, items, setItems) => {
    e.dataTransfer.setData("index", index);
    e.dataTransfer.setData("items", JSON.stringify(items));
    e.dataTransfer.setData("setItems", setItems);
  };

  const onDrop = (e, setItems) => {
    const index = e.dataTransfer.getData("index");
    const items = JSON.parse(e.dataTransfer.getData("items"));
    const setItemsFunction = e.dataTransfer.getData("setItems");

    if (setItemsFunction === 'setItems1') {
      setItems1(currentItems => {
        const newItems = [...currentItems];
        newItems.splice(index, 1);
        return newItems;
      });

      setItems(currentItems => [...currentItems, items[index]]);
    } else if (setItemsFunction === 'setItems2') {
      setItems2(currentItems => {
        const newItems = [...currentItems];
        newItems.splice(index, 1);
        return newItems;
      });

      setItems(currentItems => [...currentItems, items[index]]);
    }
  };

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

  return (
    <div style={{ display: "flex", justifyContent: "space-between" }}>
      <div
        onDrop={e => onDrop(e, setItems1)}
        onDragOver={onDragOver}
        style={{ width: "40%", height: "100%", border: "1px solid black" }}
      >
        {items1.map((item, index) => (
          <div
            key={item}
            onDragStart={e => onDragStart(e, index, items1, 'setItems1')}
            draggable
            style={{ margin: "10px" }}
          >
            {item}
          </div>
        ))}
      </div>
      <div
        onDrop={e => onDrop(e, setItems2)}
        onDragOver={onDragOver}
        style={{ width: "40%", height: "100%", border: "1px solid black" }}
      >
        {items2.map((item, index) => (
          <div
            key={item}
            onDragStart={e => onDragStart(e, index, items2, 'setItems2')}
            draggable
            style={{ margin: "10px" }}
          >
            {item}
          </div>
        ))}
      </div>
    </div>
  );
};

export default App;```
Here's a code snippet for the requested React component:

```javascript
import React, { useState } from 'react';

const App = () => {
  const [items1, setItems1] = useState(['Item 1', 'Item 2', 'Item 3']);
  const [items2, setItems2] = useState([]);

  const onDragStart = (e, index, items, setItems) => {
    e.dataTransfer.setData("index", index);
    e.dataTransfer.setData("items", JSON.stringify(items));
    e.dataTransfer.setData("setItems", setItems);
  };

  const onDrop = (e, setItems) => {
    const index = e.dataTransfer.getData("index");
    const items = JSON.parse(e.dataTransfer.getData("items"));
    const setItemsFunction = e.dataTransfer.getData("setItems");

    if (setItemsFunction === 'setItems1') {
      setItems1(currentItems => {
        const newItems = [...currentItems];
        newItems.splice(index, 1);
        return newItems;
      });

      setItems(currentItems => [...currentItems, items[index]]);
    } else if (setItemsFunction === 'setItems2') {
      setItems2(currentItems => {
        const newItems = [...currentItems];
        newItems.splice(index, 1);
        return newItems;
      });

      setItems(currentItems => [...currentItems, items[index]]);
    }
  };

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

  return (
    <div style={{ display: "flex", justifyContent: "space-between" }}>
      <div
        onDrop={e => onDrop(e, setItems1)}
        onDragOver={onDragOver}
        style={{ width: "40%", height: "100%", border: "1px solid black" }}
      >
        {items1.map((item, index) => (
          <div
            key={item}
            onDragStart={e => onDragStart(e, index, items1, 'setItems1')}
            draggable
            style={{ margin: "10px" }}
          >
            {item}
          </div>
        ))}
      </div>
      <div
        onDrop={e => onDrop(e, setItems2)}
        onDragOver={onDragOver}
        style={{ width: "40%", height: "100%", border: "1px solid black" }}
      >
        {items2.map((item, index) => (
          <div
            key={item}
            onDragStart={e => onDragStart(e, index, items2, 'setItems2')}
            draggable
            style={{ margin: "10px" }}
          >
            {item}
          </div>
        ))}
      </div>
    </div>
  );
};

export default App;```