front-tools-pro

介绍

希望能打造一个通用的前端工具库，欢迎加入

软件架构

软件架构说明

安装教程

1. yarn add front-tools-pro
2. npm install front-tools-pro

使用说明

1. node 环境 const { sumToList } = require("front-tools-pro");
2. 浏览器 import * as tools from "front-tools-pro";

参考文档

Array 类型的方法

判断是否不是空数组 isNotEmptyArray

• 使用场景
  • 有些时候对想访问数组第 0 的下标有奇效
• 返回值
  • true 或者 false
• 参考示例 if(isNotEmptyArray(data)){ // dosomething }

处理数据，把空数组变成 null postArray

• 使用场景
  • 对于可以展开的表格，如果 children 是空数组，也会有展开的图标，通过这个方法就可以把空数组变成 null，从而解决没有数据还有展开图标的问题
• 返回值
  • Array
• 参考示例 const data = postArray(res.data,"children")

  参数	说明	类型	默认值	版本
  第一个参数	需要改变的数组	Array	[]
  第二个参数	children的字段名称	String	children

对数组的某些字段求和 sumToList

• 使用场景
  • 我们很多时候都需要对数组的一个或多个字段求和，不想一次次的写重复代码，所以这个方法就产生啦
• 返回值
  • 一个对象，key 为求和的字段名，value 是对应的和
• 参考示例 const {a,b,c}=sumToList({ origin:[{a:1,b:2,c:3},{a:1,b:2,c:3},{a:1,b:2,c:3}], fieldList:["a","b","c"] }) // console.log(a,b,c) 3,6,9

  参数	说明	类型	默认值	版本
  origin	求和的数组	Array	[]
  fieldList	求和的字段名	Array[String]	不传的时候是纯数字数组求和

从数组中查找返回需要的字段 listFindItemValue

• 使用场景
  • 后端返回的数据中只有 code，没有 name，但是我们页面上需要显示 name，所以需要通过 code 找到数据中的 name 来显示
• 返回值
  • 与 code 对应的你需要的字段
• 参考示例 const result = listFindItemValue({ origin:[{code:"1",name:"张三"},{code:"1",name:"李四"}], fieldName:"code", needFieldName:"name", value:"1" }) // console.log(result) "张三"

参数	说明	类型	默认值	版本
origin	数据源，在哪里找	Array	[]
fieldName	对比的字段名称	String
needFieldName	需要返回的字段名称	String
value	需要比较的值	String|Number
equal	是不是全等	String	默认==可选===

改变某一行某个字段 changeFieldData

• 使用场景
  • 表格数据中，有些时候只需要改变一个字段的值
• 返回值
  • 改变后的数组
• 参考示例 const result = changeFieldData({ origin:[{code:"1",name:"张三"},{code:"1",name:"李四"}], fieldName:"code", fieldValue:"1", changeFieldName:"name", changeFieldvalue:"张三丰", childrenName:"children", }) // console.log(result) [{code:"1",name:"张三丰"},{code:"1",name:"李四"}]

参数	说明	类型	默认值	版本
origin	数据源，在哪里找	Array	[]
fieldName	对比的字段名称	String
fieldValue	对比的字段值	String|Number
changeFieldName	需要改变的字段名称	String
changeFieldvalue	需要改变的字段值	String|Number
childrenName	children字段名称	String	适用于treeData

改变某一行数据 changeRowData

• 使用场景
  • 表格数据中，有些时候需要改变多个字段的值，如果用 changeFieldData 就得用好几次，所以就有了这个改变一行的方法
• 返回值
  • 改变后的数组
• 参考示例 const result = changeRowData({ origin:[{code:"1",name:"张三"},{code:"1",name:"李四"}], fieldName:"code", rowData:{code:"1",name:"张三丰"}, childrenName:"children", }) // console.log(result) [{code:"1",name:"张三丰"},{code:"1",name:"李四"}]

参数	说明	类型	默认值	版本
origin	数据源，在哪里找	Array	[]
fieldName	数据中唯一的字段 比如 id	String
rowData	一行改造好的数据	object
childrenName	children字段名称	String	适用于treeData

根据一个数组转换成下拉列表需的数据 listToOptions

• 使用场景
  • 许多下拉列表的数据来源于接口，
• 返回值
  • 组装好的适用于下拉的数据源
• 参考示例 const result = listToOptions({ origin:[{code:"1",name:"张三"},{code:"1",name:"李四"}], labelVal:"name", valueVal:"code", labelKey:"label", valueKey:"value", }) // console.log(result) [{code:"1",name:"张三丰",value:"1",label:"张三丰"},{code:"1",name:"李四",value:"1",label:"李四"}]

参数	说明	类型	默认值	版本
origin	数据源	Array	[]
labelVal	label的值	String|(item)=>{}
valueVal	value的值	String|(item)=>{}
showAll	是否显示全部	Boolean	false
labelKey	label	String	可以根据不同的UI框架调整
valueKey	value	String	可以根据不同的UI框架调整
emptyTxt	全部的文字	String	全部

根据一个数组转换成 ENUM 类型 listToEnum

• 使用场景
  • 许多下拉列表的数据来源于接口，适用于 antdPro，其他的 UI 没有测试过
• 返回值
  • 组装好的适用于下拉的数据源
• 参考示例 const result = listToEnum({ origin:[{code:"1",name:"张三"},{code:"1",name:"李四"}], labelName:"name", valueName:"code", showAll:false, }) // console.log(result) [{"1":{text:"张三"}},{"2":{text:"李四"}}]

参数	说明	类型	默认值	版本
origin	数据源	Array	[]
labelName	label的值	String|(item)=>{}
valueName	value的值	String|(item)=>{}
showAll	是否显示全部	Boolean	false

适用于对象数组和 treeData 的去重 objListUnique

• 使用场景
  • 对象数组或者 treedata 的数据有重复，但是我们需要的是不重复的时候
• 返回值
  • 处理好的数据
• 参考示例 const result = objListUnique({ origin:[{code:"1",name:"张三"},{code:"1",name:"张三"}], fieldName:"code", childrenName:"children", }) // console.log(result) [{code:"1",name:"张三"}]

参数	说明	类型	默认值	版本
origin	数据源	Array	[]
fieldName	需要去重的字段	String
childrenName	children的字段名	children

value 数组去重 valListUnique

• 使用场景
  • 对象数组或者 treedata 的数据有重复，但是我们需要的是不重复的时候
• 返回值
  • 处理好的数据
• 参考示例 const result = valListUnique({ origin:["张三","张三","张三丰"], fieldName:"code", childrenName:"children", }) // console.log(result) ["张三","张三丰"]

参数	说明	类型	默认值	版本
有且只有一个参数	数据源	Array[String|Number]	[]

参与贡献

1. Fork 本仓库
2. 新建 Feat_xxx 分支
3. 提交代码
4. 新建 Pull Request