尝试在React状态下将项从一个数组移动到另一个数组

import React, { useState } from 'react';

const App = () => {
  const [sourceArray, setSourceArray] = useState(['Item 1', 'Item 2', 'Item 3']);
  const [targetArray, setTargetArray] = useState([]);

  const moveItem = (item) => {
    const updatedSourceArray = sourceArray.filter((sourceItem) => sourceItem !== item);
    const updatedTargetArray = [...targetArray, item];

    setSourceArray(updatedSourceArray);
    setTargetArray(updatedTargetArray);
  };

  return (
    <div>
      <h2>Source Array:</h2>
      <ul>
        {sourceArray.map((item) => (
          <li key={item}>
            {item}
            <button onClick={() => moveItem(item)}>Move</button>
          </li>
        ))}
      </ul>

      <h2>Target Array:</h2>
      <ul>
        {targetArray.map((item) => (
          <li key={item}>{item}</li>
        ))}
      </ul>
    </div>
  );
};

export default App;