# PageLayoutV1
## 布局
```
PageLayout
            - - - - - - - - - - - - -
    PageHeader  --->|               |-------PageTabHeader   拓展为含有Tab和时间筛选的顶部栏
            - - - - - — — — — — — — —
                    | PageFilter插槽 |
    PageContent --->|               |-------PageFilter      页面筛选
                    - - - - - - - - -
                    | PageCore 插槽  | /-----PageTableCore   拓展为含有表格的页面核心部分
                    |               |/
                    |               |\
                    |               | \-----PageChartCore   拓展为含有图表的页面核心部分
            - - - - — — — — — — — — -

                        UI层                含组件和部分JS的UI层

备注: PageContent: 可滚动、接收 PageFilter 和 PageCore
```
## PageLayout
### config
参数 | 说明 | 类型 | 默认值 | 是否必传 | 版本
---|---|---|---|---|---
children | React.Child | string | React / React.ReactNode | 无 | 否 | 3.1.0


## example
```typescript
<PageLayout>
    <PageHeader title="AAA" />
    <PageContent>
        <PageFilter
            loading={this.state.loading}
            filters={this.renderFilters()}
            onResetFilters={this.onResetFilters}
            onSearch={this.onSearchFilters}
         />
        <PageCore title='BBB' extra={this.renderCardExtra()} >
            <ResizeTable
                ref={ref => this.$tableRef = ref}
                tableProps={{
                    columns: tableColumns,
                    dataSource: data,
                    rowKey: record => record['creativeId'],
                    loading: loading,
                    rowSelection: {
                        fixed: true,
                        selectedRowKeys,
                        columnWidth: '50px',
                        onChange: this.onRowSelectChange,
                    }
                }}
                paginationProps={{
                    pagination: {
                        current: current,
                        total: total,
                        pageSize: pageSize,
                    },
                    onShowSizeChange: this.onHandlePageSizeChange,
                    onChange: this.onHandlePageChange
                }}
            />
        </PageCore>
    </PageContent>
</PageLayout>
```