---
description: 'A Button component.'
labels: ['label1', 'label2', 'label3']
---

import DetialHeader from './index'
import '@platformuiserver/platformui.assets/css/index.less'

### 组件使用方式

```js
<div style={{ minWidth: '400px', border: '5px solid #e8e8e8' }}>
  <DetialHeader
    type="TYPE"
    data={{
      id: 'id',
      name: '名称'
    }}
  >
    <div style={{ marginLeft: '10px' }}>内容区域</div>
  </DetialHeader>
</div>
```

### Using props to customize the text

Modify the text to see it change live:

```js live
<div style={{ minWidth: '400px', border: '5px solid #e8e8e8' }}>
  <DetialHeader
    type="TYPE"
    data={{
      id: 'id',
      name: '名称'
    }}
  >
    <div style={{ marginLeft: '10px' }}>内容区域</div>
  </DetialHeader>
</div>
```
