1.0.10 • Published 6 years ago
@fvaa/monitor v1.0.10
@fvaa/monitor
通用的路由监听处理架构,它主要分两中模式:
hashchange传统hash路由模式popstate基于html5路由模式
它能够快速为你创建路由监听,省去您的工作时间,同时保障质量和效率。
Usage
从npm下载模块:
npm i @fvaa/monitor在代码中使用
import Monitor, { Request, Response } from '@fvaa/monitor';
// create instance
const createServer = Monitor({
// prefix: '/api',
event: 'hashchange'
});
// create server
// and listen url redirection maps on start time.
createServer(
async (req: Request, res: Response) => console.log(req, res)
).listen({
'/': '/abc'
});Monitor.options
prefix指定当前路由前缀event您期望使用的监听事件名 hashchange 或 popstate 默认:hashchangeerror错误处理函数
错误处理函数可以这样这样写
// ts type: error?(e: Error, req: Request, res: Response): void
Monitor({
error(err, req, res) {
console.log(err, req, res);
}
})createServer
它用来处理请求变化时候的响应函数。它的参数即回调函数,每个回调函数必须是async函数。我们来看下它的ts定义:
export type AsyncRequestPromiseLike<T> = (req: Request, res: Response) => Promise<T>;
// ...
(...fns: Array<AsyncRequestPromiseLike<void>>) => MonitorContext所以我们可以这样使用
createServer(
async (req: Request, res: Response) => console.log(1, req, res),
async (req: Request, res: Response) => console.log(2, req, res),
async (req: Request, res: Response) => console.log(3, req, res),
...
)listen
在初始化页面的时候,我们可以通过定义一个redirection map来转接路由地址:
createServer(...).listen({
'/': '/abc',
'/test': '/yyyyyy/123'
})当我们当前的URL在/的时候,自动转换为/abc路由;当我们当前的URL在/test的时候,自动转换为/yyyyyy/123路由。
注意,此功能值在页面初始化时候有效。
Response
我们提供3中交互方法:
redirect(url:string)为浏览器历史记录添加一条数据replace(url:string)替换当前浏览器历史记录为新记录reload()重载历史记录。
await res.redirect('/test');
await res.replace('/test');
await res.reload();License
Copyright (c) 2018-present, yunjie (Evio) shen