如何在react中呈现嵌套数组

import React from 'react';

function NestedArray({ data }) {
  return (
    <ul>
      {data.map((item, index) => (
        <li key={index}>
          {Array.isArray(item) ? (
            <NestedArray data={item} />
          ) : (
            item
          )}
        </li>
      ))}
    </ul>
  );
}

export default function App() {
  const nestedArray = [
    'Item 1',
    ['Item 2.1', 'Item 2.2'],
    'Item 3',
    ['Item 4.1', ['Item 4.2.1', 'Item 4.2.2']],
  ];

  return (
    <div>
      <h1>Nested Array Example</h1>
      <NestedArray data={nestedArray} />
    </div>
  );
}