1.0.1 • Published 2 years ago
@klicen/utils
公司前端项目的常用方法的集合项目。
Install
npm install @klicen/utils --save #在安装之前请确保npm的仓库地址已经指向了公司内部私有npm仓库地址
Example Usage
// 常规使用
import { isEmpty } from '@klicen/utils';
console.log(isEmpty(0, false)) // false
// 按需引入
import isEmpty from '@klicen/utils/lib/isEmpty';
cosole.log(isEmpty(0, false)) // false
常用方法列表
方法名称 | 方法说明 | 参数 | 返回值 |
---|
request 说明 | 发送ajax请求 | (url, options说明) | Promise 说明 |
blobToDataURL | blob转成Base64 | (blob, callback) | -- |
dataURLtoBlob | Base64转换成blob | (Base64) | Blob |
deepAssign | 深度合并对象 | (obj1, obj2, ...) | Object |
difference | 深度比较两个对象 | (obj1, obj2, option 说明) | Object |
fillZero | 数字0的填充 | (value) | String |
findTreeDataByProps | 通过props在树节点中找到对应的数据 | (treeData, findProp, childrenProp) | Object |
getGoogleFromGPS | 将GPS坐标转换成Google地图坐标 | longitude, latitude | longitude, latitude |
getGoogleFromGPSByArr | 批量将GPS坐标转换成Google地图坐标 | [longitude, latitude] | [longitude, latitude] |
getGPSFromGoogle | 将Google地图坐标转换成为GPS坐标 | longitude, latitude | longitude, latitude |
getGPSFromGoogleByArr | 批量将Google地图坐标转换成为GPS坐标 | [longitude, latitude] | [longitude, latitude] |
getQueryString | 根据名称获取URL上面的参数 | (name, url) | Object |
isEmptyObj | 判断一个对象是否为空对象 | Object | Boolean |
isEmpty | 判断一个Javascript数据类型是否为空 | Object | Boolean |
getKlicenAgent | 获取用于后端请求的klicen-agent头部信息 | productName, productVersion | String |
searchInTree | 在树结构中搜索指定的值,形成一颗新的树 | searchKey, treeData, result, options参数说明 | Object |
doPrint | 使用iframe实现打印 | (id, callback) | -- |
transformUtils | 常规方法集合,包含get,format,analysisErrors,invalidDisplay,chainedUtils方法 | -- | -- |
request 方法说明
该方法返回一个可供配置的方法(function(options){}), 用于自定义我们自己的一些参数,如:BaseURL、request拦截器、response拦截器等等。所以,我们一般会对我们的request进行二次封装,示例如下:
import { request } from "@klicen/utils";
return request({
baseURL: 'http://xxxx.klicen.com',
interceptors: {
response: response => {
return response;
},
responseError: error => {
return error.response;
}
}
});
request options 参数说明
选项名称 | 默认值 | 选项说明 |
---|
method | 'GET' | 请求Ajax的方式 |
params | {} | 请求Ajax所需要的参数 |
fullData | false | 是否返回请求回来的所有数据({code: 'xxx', data: 'xxx', msg: 'xxx'}), 默认情况下,只返回data的数据 |
request 返回值说明
request请求结果以Promise的方式返回,如果请求结果正常,则我们所需要的数据则是Promise的结果。否则,则会抛出一个Error的错误,同时,请求回来的Error数据则会附加在error.data中,如下示例:
request('/auth/info').then(data => {
console.log(data); // 正常请求结果保存在data中(以剔除带了code和msg)
}).catch(err => {
console.log(err.message); // 错误的请求则会以error的形式抛出。
console.log(err.data); //错误的请求数据会附加在error对象上面。
});
difference options说明
选项名称 | 默认值 | 选项说明 |
---|
transform | false | 是否针对于Moment对象转换 |
exclude | false | 排除对应的对象key不做比较 |
searchInTree 参数说明
选项名称 | 参数类型 | 默认值 | 选项说明 |
---|
searchKey | String | -- | 搜索关键字 |
treeData | Array | -- | 待搜索的树形结构数据 |
result | Array | -- | 用户存储搜索后的新的树形数据 |
options | Object | {searchProp: 'label', childrenProp: 'children'} | 设置需要搜索的字段属性和子节点列表的字段属性 |
transformUtils 方法说明
方法名称 | 方法说明 | 参数 | 返回值 |
---|
get | 获取具有深层嵌套结构的对象值,没获取到值时可设置默认值 | (obj, path, defaultValue) | (string、boolean等) |
format | 定义日期格式 | (value, fm) | string |
analysisErrors | 解析错误提示信息,仅仅适用非code,msg模式 | (msg) | (string、obj) |
invalidDisplay | 目标值为空或者Invalid date时,替换为相应值 | (value, { df }) | (value/df) |
chainedUtils | 链式调用,end方法结束 | (value) | value |