dk-iot utils

Install

npm i @kamuisdo/utils --save

pnpm add @kamuisdo/utils

Introduce

提供各类项目开发中常用的工具函数

• withDefaultProps
• searchFormDateFormat

withDefaultProps

何时使用：为项目中频繁使用的组件定义默认的props时，保持组件的一致性和便于全局性的修改

• 为组件定义默认props，使用deepmerge来合并实例props及默认props
• 一个包装组件的工厂方法

import { withDefaultProps } from '@kamuisdo/utils'
import TestContent from "./testComponent";
import type { props } from "./testComponent";

const TestContentWithDefaultProps = withDefaultProps<props>(TestContent,{
	content:{ text: 'fixed content', date: '2023-11-9'  },
	dataItem: [{ value: 0, text: 'default text' }]
})
	
// content 的内容也会被渲染
<TestContentWithDefaultProps title="myTitle" dataItem={[{value: 1, text: 'my text'}]}/>

api

function withDefaultProps<P>( Component: any, defaultProps: Partial<P> | (()=> Partial<P>), options?: modeVal<P> | boolean)

• defaultProps 可以是一个返回默认props的方法
• options 定义是如何合并默认props和实例props
  • 可以是Boolean
    • 为true时，使用deepmerge的cover合并，即默认props中类型数组、方法的属性被实例props覆盖
    • 为false时，不使用deepmerge，所有类型的属性都会被实例props覆盖
  • 可以是对象，与deepmerge的参数一致，定义各个属性不同的合并规则

searchFormDateFormat

何时使用：查询表单中有时间段、日期段的数据需要做统一的格式化处理时

• 格式化查询表单中的日期格式，将组件返回的{myTime: [Moment, Moment]}转为{ myTimeStart: string, myTimeEnd: string }
• 默认的规则是在原本的字段加入Start和End后缀
• 字段中存在Time和time默认自动处理
• 字段的数据不是数组类型时，将被忽略，不做处理
• 如存在多个时间段字段，但是字段规则没有统一的规律，则不适用此方法

// 通过DateRange获取的时间段数据
const orgFormVal = { createTime: [Moment, Moment] }

const formVal = searchFormDateFormat(orgFormVal)
// { createTimeStart: 2023-12-12 12:00:00, createTimeEnd: 2023-12-12 24:00:00 }

api

function searchFormDateFormat<OrgVal=any,FinalVal=any>(value: OrgVal, option?: formatOption) : FinalVal

type formatOption = {
	format?: string | formatFn // 开始时间和结束时间的format，如果设置了startFormat，endFormat，则优先使用startFormat，endFormat
	startFormat?: string | formatFn // 开始时间的format
	endFormat?: string | formatFn // 结束时间的format
	startKey?: string // 开始时间的Key
	endKey?: string // 结束时间的Key
	suffix?: string // 在原来字段名中添加后缀
	targetKey?: string | string[] // 根据此规则找到value中需要被格式转换的字段，否则按照默认字段规则查找字段
}