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组件
-
Media Queries辅助库;
only screen and (max-width: 767.99px)
匹配时为手机端
3. 参数别名和默认值
// 设置location 的别名为 PropsLayout,默认值为testconst layout: PropsLayout = 'test' location: pathname } = thisprops;