如何在Fluent UI React中使用可折叠列表

npm install @fluentui/react

import { Accordion, Text } from '@fluentui/react';

const sections = [
  {
    title: 'Section 1',
    content: 'Content for Section 1',
  },
  {
    title: 'Section 2',
    content: 'Content for Section 2',
  },
  // 可以添加更多的节
];

const renderSections = sections.map(section => ({
  title: section.title,
  content: { content: <Text content={section.content} /> },
}));

const App = () => {
  return (
    <Accordion
      defaultActiveIndex={[0]} // 默认展开的节的索引，可以根据需要设置
      panels={renderSections} // 渲染的节的数组
    />
  );
};

export default App;