如何在React中添加更多的多维数组项

const multiDimensionalArray = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

import React, { useState } from 'react';

const MyComponent = () => {
  const [multiDimensionalArray, setMultiDimensionalArray] = useState([
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
  ]);

  // 添加新的多维数组项
  const addArrayItem = () => {
    const newArrayItem = [10, 11, 12];
    setMultiDimensionalArray(prevArray => [...prevArray, newArrayItem]);
  };

  return (
    <div>
      {/* 渲染多维数组 */}
      {multiDimensionalArray.map((array, index) => (
        <div key={index}>
          {array.map((item, itemIndex) => (
            <span key={itemIndex}>{item} </span>
          ))}
        </div>
      ))}

      {/* 添加新的多维数组项按钮 */}
      <button onClick={addArrayItem}>添加多维数组项</button>
    </div>
  );
};

export default MyComponent;