admin-ui

使用

使用命令行

$ npm install
$ npm start         # 访问 http://localhost:8001

使用 docker

// dev 
$ npm run docker:dev

// build 
$ npm run docker:build


// production dev 
$ npm run docker-prod:dev

// production build 
$ npm run docker-prod:build

支持环境

现代浏览器及 IE11。

React skill

1. Context

在多个不同层级的组件中共享数据；过度使用会导致组件难以维护

2. 响应式布局

参照 Bootstrap 的 响应式设计，预设六个响应尺寸：xs sm md lg xl xxl。 span pull push offset order 属性可以通过内嵌到 xs sm md lg xl xxl 属性中来使用。其中 xs={6} 相当于 xs={{ span: 6 }}。

| 尺寸 | xs(<576px) | sm(≥576px) | md (≥768px) | lg(≥992px) | xl≥1200px | xll≥1600px | | ---- | ---------- | ---------- | ----------- | ---------- | --------- | ---------- | | | | | | | | |

• 使用react-container-query来检测屏幕尺寸，见BasicLayout组件

• enquire-js && enquire.js

  Media Queries辅助库; only screen and (max-width: 767.99px) 匹配时为手机端

3. 参数别名和默认值

// 设置location 的别名为 PropsLayout，默认值为test
const {
    layout: PropsLayout = 'test',
    location: { pathname },
} = this.props;

4. 上传下载