iri-common-utils v2.0.0
公共方法库(维护项目工具方法)
基于rollup+ts搭建的方法库,抽离常用方法封装,方便在项目中导入使用
如何使用?
在html中直接引入的方式
<script src="./dist/iri-common-utils.min.js"></script>
在工程项目中引入
1.npm link方式
iri-common-utils工程目录下执行
npm link
目标工程目录下执行
npm install npm link <utils方法库package包名> npm run build npm link
项目文件中导入相关方法:
// es6导入 import {...} from 'utils方法库package包名' // 在nodejs中使用 const {...} = require('utils方法库package包名')
2.npm install方式
在工程项目主文件夹下执行命令:
npm i <utils方法库package包名>
项目文件中导入相关方法:
// es6导入 import {...} from 'utils方法库package包名' // 在nodejs中使用 const {...} = require('utils方法库package包名')
方法目录
- getType
- diffTime
- deepClone
- debounce
- throttle
- transformValue
- getLabelByValue
- transformArraytoTree
- transformTreeToArray
- validateField
- isEmptyArray
- isNonEmptyArr
- getRandOfDigits
- getTimePreRand
- toNum
- fixNum
- transformNum
- handleValue
- setHandleValue
- trimValue
- setTrimValue
方法使用
getType (获取参数类型)
- 参数
- item <any> 传入的参数
返回值
- data <string>
example
input:import { getType } from 'iri-common-utils' const s = 'hello world' getType(s)
output:
string
diffTime (计算时间间隔,并返回字符串格式)
- 参数
- duration <number> 时间间隔单位ms
返回值
- data <object>
- dur <number> 剩余毫秒数
- strTime <string> 字符串形式间隔时间
- data <object>
example
input:import { diffTime } from 'iri-common-utils' const duration = 100000000 diffTime(duration)
output:
{ dur: 0, strTime: '1天3时46分40秒' }
deepClone (数据深拷贝,一般用于拷贝引用类型数据)
- 参数
- target <any> 原始数据对象
返回值
- data <any>
example
input:import { deepClone } from 'iri-common-utils' const obj ={a:'1', b:'2'} deepClone(obj)
output:
{a:'1', b:'2'}
debounce (用于函数防抖,一般用于搜索防止多次请求)
- 参数
- fn <function> 执行函数
- delay <number> 间隔时间, 非必传,默认 500ms
- immediate <boolean> 是否立即执行, 非必传, 默认 false
返回值
- func <function> 返回一个闭包,用于调用执行及传参
example
input:import { debounce } from 'iri-common-utils' const fn = () => {console.log('aaaaa')} debounce(fn,1000)()
output:
.....
throttle (用于函数节流,规定时间内执行一次)
- 参数
- fn <function> 执行函数
- delay <number>间隔时间, 非必传,默认 500ms
返回值
- func <function> 返回一个闭包,用于调用执行及传参
example
input:import { throttle } from 'iri-common-utils' const fn = () => {console.log('aaaaa')} throttle(fn,1000)()
output:
.....
transformValue (将获取的数据转换格式)
- 参数
- oldData <array> 服务器返回数据
- mapField <object>
- labelField <string> 转化label所需要的字段
- valueField <string> 转化value所需要的字段
返回值
- newData <array>
example
input:import { transformValue } from 'iri-common-utils' const arr = [ { name: 'aa', age: 18 }, { name: 'bb', age: 19 }, { name: 'cc', age: 20 }, { name: 'dd', age: 21 }, ] transformValue(arr,{ labelField: 'name', valueField: 'age' })
output:
getLabelByValue (根据value获取对应的label)
- 参数
- oldData <array> 服务器返回数据
- value <array>
- mapField <object>
- labelField <string> 转化label所需要的字段
- valueField <string> 转化value所需要的字段
返回值
- label <array>
example
input:import { getLabelByValue } from 'iri-common-utils' const arr = [ { name: 'aa', age: 18 }, { name: 'bb', age: 19 }, { name: 'cc', age: 20 }, { name: 'dd', age: 21 }, ] getLabelByValue(arr,20,{ labelField: 'name', valueField: 'age' })
output:
'cc'
transformArraytoTree (将数组转换为树形数组)
- 参数
- data <array> 原始数据
- mapField <object>
- childFiled <string> 子节点字段名称,非必传,默认值 children
- parentField <string> 父节点字段名称,非必传,默认值 pid
- idField <string> 当前节点的id,非必传,默认值 id
- defaultNoParentId <string> 默认无父级的id,非必传,默认值 0
返回值
- newData <array>
example
input:import { transformArraytoTree } from 'iri-common-utils' const arr = [ { title: 'aaaa', id: 1, pid: 0 }, { title: 'aaaa', id: 2, pid: 3 }, { title: 'aaaa', id: 3, pid: 0 }, { title: 'aaaa', id: 4, pid: 3 }, { title: 'aaaa', id: 5, pid: 4 }, { title: 'aaaa', id: 6, pid: 5 }, ] transformArraytoTree(arr)
output:
[{"title":"aaaa","id":1,"pid":0},{"title":"aaaa","id":3,"pid":0,"children":[{"title":"aaaa","id":2,"pid":3},{"title":"aaaa","id":4,"pid":3,"children":[{"title":"aaaa","id":5,"pid":4,"children":{"title":"aaaa","id":6,"pid":5}}]}]}]
transformTreeToArray (树形数组扁平化,深度优先遍历)
- 参数
- data <array> 原始数据
- defaultChildField <string> 子节点字段名称,非必传,默认值 children
返回值
- newData <array>
example
input:import { transformTreeToArray } from 'iri-common-utils' const arr = [{"title":"aaaa","id":1,"pid":0},{"title":"aaaa","id":3,"pid":0,"children":[{"title":"aaaa","id":2,"pid":3},{"title":"aaaa","id":4,"pid":3,"children":[{"title":"aaaa","id":5,"pid":4,"children":[{"title":"aaaa","id":6,"pid":5}]}]}]}] transformTreeToArray(arr)
output:
validateField (用于验证 身份证,护照,数字,手机号,邮箱等,可自定义)
- 参数
- data <string> 验证字符串
- options <object>
- dType <string> 非必传,'number' | 'IDCard' | 'mobile' | 'passport' | 'email'
- regex <Regex> 自定义正则表达式,非必传,优先级比 dType 更高
返回值
- value <boolean> 返回布尔值
example
input:import { validate } from 'iri-common-utils' const str = '13065218789' console.log(validate(str,{dType: 'mobile'}))
output:
true
isEmptyArray (验证是否为空数组)
- 参数
- data <array> 数据
返回值
- value <boolean> 返回布尔值
example
input:import { isEmptyArray } from 'iri-common-utils' const arr = [] isEmptyArray(arr)
output:
true
isNonEmptyArr (验证是否非空数组)
- 参数
- data <array> 数据
返回值
- value <boolean> 返回布尔值
example
input:import { isNonEmptyArr } from 'iri-common-utils' const arr = [0,1,2,3] isNonEmptyArr(arr)
output:
true
getRandOfDigits (生成指定位数的随机字符串)
- 参数
- data <number> 指定位数,默认值6
返回值
- value <string> 返回随机字符串
example
input:import { getRandOfDigits } from 'iri-common-utils' const digits = 6 getRandOfDigits(digits)
output:
'337436'
getTimePreRand 生成指定位数的随机字符串(有时间戳前缀,至少13位)
- 参数
- data <number> 指定位数,默认值19
返回值
- value <string> 返回随机字符串
example
input:import { getTimePreRand } from 'iri-common-utils' const digits = 19 getTimePreRand(digits)
output:
'1646214076422322816'
toNum 转数字
- 参数
- data <any> 需要转换的数据,一般是string | number
返回值
- value <number> 转换后的数字
example
input:import { toNum } from 'iri-common-utils' const data = '123456.789' toNum(data)
output:
123456.789
fixNum 保留指定位数小数
- 参数
- data <any> 需要转换的数据,一般是string | number
- digit <number> 保留的小数位数,0-20,默认2
返回值
- value <number> 保留指定位数小数的数字
example
input:import { fixNum } from 'iri-common-utils' const data = '123456.789' fixNum(data, 1)
output:
123456.8
transformNum 转换数字为本地化字符串
- 参数
- data <any> 需要转换的数据,一般是string | number
- digit <number> 保留的小数位数,0-20,默认2
- locales <string | undefined> 本地化参数
- options <object> options参数
返回值
- value <string> toLocaleString的本地化字符串
example
input:import { transformNum } from 'iri-common-utils' const data = '123456.789' transformNum(data, 1)
output:
'123,456.8'
handleValue 处理输入事件对象的value
- 参数
- data <any> 输入事件对象
- method <string | Function> 处理方法或函数
返回值
- value <any> 处理后的value
example
input:import { handleValue } from 'iri-common-utils' var e = { target: { value: " wqe 13 2f " } }; handleValue(e, (v) => v + 666)
output:
' wqe 13 2f 666'
setHandleValue 设置处理后的表单值
- 参数
- data <any> 输入事件对象
- name <string> 表单元素的name
- form <any> 当前表单元素所属的form对象实例
- method <string | Function> 处理方法或函数
返回值
- undefined
example
input:import { setHandleValue } from 'iri-common-utils' var formRef = React.createRef(); var e = { target: { value: " wqe 13 2f " } }; setHandleValue(e, name: 'string', form: formRef, (v) => v + 666)
<Form ref={formRef}> <Form.Item name="string" > <Input /> </Form.Item> </Form>
output:
.....
trimValue 去除输入框前后空格的value
参数
- data <any> 输入事件对象
- method <string | Function> 处理方法或函数,默认值"trim"
返回值
- value <any> 处理后的value
example
input:import { trimValue } from 'iri-common-utils' var e = { target: { value: " wqe 13 2f " } }; trimValue(e)
output:
'wqe 13 2f'
setTrimValue 设置表单去除空格后的value
- 参数
- data <any> 输入事件对象
- name <string> 表单元素的name
- form <any> 当前表单元素所属的form对象实例
- method <string | Function> 处理方法或函数
返回值
- undefined
example
input:import { setTrimValue } from 'iri-common-utils' var formRef = React.createRef(); var e = { target: { value: " wqe 13 2f " } }; setTrimValue(e, name: 'string', form: formRef, (v) => v + 666)
<Form ref={formRef}> <Form.Item name="string" > <TextArea /> </Form.Item> </Form>
output:
.....
反馈 & 建议
待反馈......