https://github.com/hanai/rax-page-layout
Classic page layout for rax application.
https://github.com/hanai/rax-page-layout
component layout pull-to-refresh rax rax-application
Last synced: about 1 year ago
JSON representation
Classic page layout for rax application.
- Host: GitHub
- URL: https://github.com/hanai/rax-page-layout
- Owner: hanai
- License: mit
- Created: 2020-05-02T04:37:07.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2022-12-12T15:59:45.000Z (over 3 years ago)
- Last Synced: 2025-03-18T12:57:33.022Z (about 1 year ago)
- Topics: component, layout, pull-to-refresh, rax, rax-application
- Language: TypeScript
- Size: 3.93 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 18
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
## rax-page-layout
Classic page layout for rax application.
|  |
| --- |
| [web](https://blog.ihanai.com/rax-page-layout/build/web/index.html) |
## Install
``` bash
$ npm install rax-page-layout --save
```
## Usage
```
import { PageLayout, PageHeader, PageFooter, PageMain } from 'rax-page-layout';
```
## Components
### PageLayout
Layout view for a page.
#### Props
| **name** | **type** | **default** | **required** | **describe** | **support** |
|:---|:---|:---|:---|:---|:---|
| children | RaxNode | - | false |PageMain \| PageHeader \| PageFooter | 
|
### PageMain
Main content container for a page.
#### Props
| **name** | **type** | **default** | **required** | **describe** | **support** |
|:---|:---|:---|:---|:---|:---|
| children | RaxNode | - | false | children element | |
| hasPullToRefresh | boolean | false | false | if has pull to refresh | |
| isRefreshing | boolean | false | false | refresh state | |
| betterScroll | boolean | false | false | if use better-scroll | |
### PageHeader/PageFooter
## Example
```
import { createElement, render } from 'rax';
import DriverUniversal from 'driver-universal';
import { PageLayout, PageHeader, PageFooter, PageMain } from 'rax-page-layout';
render(, document.body, { driver: DriverUniversal });
```
---
## License
MIT