PageContainer

PageContainer 常用属性配置

const tabList = [
  {
    tab: '大屏计分规则',
    key: '1',
  },
  {
    tab: '评委打分规则',
    key: '2',
  },
  {
    tab: '打分端模式',
    key: '3',
  },
];
function App() {
  const [activeKey, setActiveKey] = useState(tabList[0].key);
  return (
    <PageContainer
      header={{
        title: '模板',
        subTitle: '基于模板的配置，更加节省工作量',
        // breadcrumb,
        ghost: false,
      }}
      tabList={tabList}
      tabProps={{
        type: 'card',
        value: activeKey,
        onChange: setActiveKey,
      }}
    >
      <RenderTab
        activeKey={activeKey}
      />
   </PageContainer>
  )
}
function RenderTab({ activeKey }) {
  switch (activeKey) {
    case '1':
      return <PcList />;
    case '2':
      return <MobileList />;
    case '3':
      return <CardList />;
    default:
      return null;
  }
}