sixue-content/demo/usage.md

魔盒系统内容模块模版

---
title: 页面内容区块
---


本 Demo 面包屑并传入页面Jsx

````jsx
import React, { Component, useState } from 'react';
import SixueContent from 'sixue-content';

const breadList = [ { name: 'Dome', link: '' }, { name: '列表展示', link: '' } ];
const tabList = [ { name: '标签tabs - 1', key: 'b1'}, { name: '标签tabs - 2', key: 'b2' } ]

export default function Content() {
  const [tabKey, setTabKey] = useState('b1');
  const tabFunc = (key) => {
    setTabKey(key);
  }
  
  return (
    <SixueContent  breadList={breadList} tabList={tabList} tabFunc={tabFunc} >
      {tabKey === 'b1' && <div>标签tabs -1  内容</div>}
      {tabKey === 'b2' && <div>标签tabs -2  内容</div>}
      <p>这里面是页面内容 Jsx</p>
    </SixueContent>
  )
}
````