kitking-h5
v1.3.3
Published
[TOC]
Downloads
8
Readme
[TOC]
kitking-h5
kitking-h5 是基于 dva-core 基础封装。功能基本还原 dva。使用方式参考dva
dynamic
dynamic 动态加载 react 组件。 dynamic(View, dynamicOps, extendProps) View:ReactElement react 组件 dynamicOps: Object 参考 react-loadable 属性 extendProps: Object 动态组件属性扩展
import dynamic from 'kitking-h5/lib/dynamic';
export default function router(app) {
const dynamicRouter = (View) => dynamic(View, dynamicOps);
return (
<Router>
<Switch>
<Route key={index} component={dynamicRouter(item.component)} />
</Switch>
</Router>
);
}
authorized
权限验证组件
import RenderAuthorized from 'kitking-h5/lib/Authorized';
import { Alert } from 'antd';
const Authorized = RenderAuthorized('user');
const noMatch = <Alert message="No permission." type="error" showIcon />;
ReactDOM.render(
<Authorized authority={['user', 'admin']} noMatch={noMatch}>
<Alert message="Use Array as a parameter passed!" type="success" showIcon />
</Authorized>,
mountNode,
);
配合路由使用
import RenderAuthorized from 'kitking-h5/lib/Authorized';
import { Redirect } from 'react-router-dom';
const Authorized = RenderAuthorized(['visitor']);
//1.创建处理登录验证组件
const LogoinAuthorized = function Authorized({ authority, children }) {
return (
<KitAuthorized authority={authority} noMatch={<Redirect to="/login" />}>
{children}
</KitAuthorized>
);
//2.路由配置需要验证登录路由
[
...
{
path: '/userInfo',
component: () => import('../containers/userInfo/UserInfo'),
authorized: LogoinAuthorized,
authority: ['user']
},
...
]
saga
调用方式 'kitking-h5/lib/saga'
router
调用方式 'kitking-h5/lib/router' import { HashRouter as Router, Switch, Route, Redirect, routerRedux } from 'kitking-h5/router';
redux
调用方式 'kitking-h5/lib/redux' import { connect } from 'kitking-h5/redux';
更新日志:
| 时间 | 类型 | 修改人 | 版本号 | 修改内容 | | ---------- | ---- | ------ | ------ | ------------------------------------------------------------------ | | 2018-11-16 | M | fusy | 1.1.1 | 添加页面切换动画全局控制开关,支持路由懒加载预加载模式,增加进度条 | | 2018-11-19 | A | fusy | 1.2.0 | 添加权限控制组件 |