概述
该工具库用来处理 url 中地址与参数,能够很方便得到我们想要的数据。
js 中有 RegExp 方法做正则表达式校验,而 path-to-regexp 可以看成是 url 字符串的正则表达式。
使用
第三方库,使用前先进行安装:
npm install path-to-regexp --save
在 js 中使用:
const pathToRegexp = require('path-to-regexp');
或
import pathToRegexp from 'path-to-regexp'
简单的使用
// 引入模块
let PathToReg = require('path-to-regexp')
// 要使用路径中找到的键填充的数组
let keys = []let reg = PathToReg('/user/:id', keys, {
end: false})
// 打印结果
console.log(reg) // /^\/user(?:\/(?=$))?(?=\/|$)/i// end = false 不必须结束
console.log(reg.test('/user')) // true
console.log(reg.test('/user/1')) // true// end = true 必须结束
let reg = PathToReg('/user', keys, {
end: true})
console.log(reg.test('/user')) // true
console.log(reg.test('/user/1')) // false
API 介绍
- pathToRegexp()
作用:这里这个方法可以类比于 js 中 new RegExp(‘xxx’)。
var pathToRegexp = require('path-to-regexp')var re = pathToRegexp('/foo/:bar')
console.log(re);
打印结果如下:
/^\/foo\/((?:[^\/]+?))(?:\/(?=$))?$/i
- exec()
作用:匹配 url 地址与规则是否相符。
var pathToRegexp = require('path-to-regexp')var re = pathToRegexp('/foo/:bar'); // 匹配规则
var match1 = re.exec('/test/route'); // url 路径
var match2 = re.exec('/foo/route'); // url 路径console.log(match1);
console.log(match2);
打印结果如下:
null
[ '/foo/route', 'route', index: 0, input: '/foo/route' ]
说明:
上述代码中,第一个 url 路径与匹配规则不相符返回 null,第二个 url 路径与匹配规则相符,返回一个数组。
- parse()
作用:解析 url 字符串中的参数部分(:id)。
var pathToRegexp = require('path-to-regexp');var url = '/user/:id';
console.log(pathToRegexp.parse(url));
打印结果如下:
[ '/user',{
name: 'id',prefix: '/',delimiter: '/',optional: false,repeat: false,partial: false,pattern: '[^\\/]+?' } ]
说明:返回一个数组,从第二个数据可以就可以得到 url 地址携带参数的属性名称(item.name)。
当然,url 中携带参数出了 :id 这种形式,还有 /user?id=11 这种,使用 parse() 方法解析自行查看结果。
- compile()
作用:快速填充 url 字符串的参数值。
var pathToRegexp = require('path-to-regexp')var url = '/user/:id/:name'
var data = {
id: 10001, name: 'bob'}
console.log(pathToRegexp.compile(url)(data))
打印结果:
/user/10001/bob
原文链接:https://www.jianshu.com/p/7d2dbfdd1b0f