Skip to content

Commit

Permalink
feat(form): get支持获取上一次的值 (#269)
Browse files Browse the repository at this point in the history
  • Loading branch information
@mengshang918
mengshang918 committed Jul 20, 2023
1 parent ef4b327 commit 13ff612
Show file tree
Hide file tree
Showing 4 changed files with 139 additions and 60 deletions.
6 changes: 5 additions & 1 deletion packages/drip-form/src/DripForm/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
* @Author: jiangxiaowei
* @Date: 2020-05-14 16:54:32
* @Last Modified by: jiangxiaowei
* @Last Modified time: 2023-02-10 16:39:57
* @Last Modified time: 2023-07-19 13:51:16
*/
import React, {
forwardRef,
Expand Down Expand Up @@ -296,6 +296,10 @@ const DripForm = forwardRef<DripFormRefType, DripFormRenderProps>(
typeMap: typePath,
dispatch,
formData,
prevFormData: usePrevious(formData),
prevDataSchema: usePrevious(dataSchema),
prevUiSchema: usePrevious(uiSchema),
prevTypeMap: usePrevious(typePath),
})

// 获取当前fieldKey相对uiSchema、dataSchema路径
Expand Down
158 changes: 103 additions & 55 deletions packages/hooks/src/useSchema.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
* @Author: jiangxiaowei
* @Date: 2021-08-06 15:33:25
* @Last Modified by: jiangxiaowei
* @Last Modified time: 2022-04-22 11:31:56
* @Last Modified time: 2023-07-20 16:45:31
*/
import { typeCheck } from '@jdfed/utils'
import { useCallback } from 'react'
Expand Down Expand Up @@ -61,12 +61,20 @@ const useSchema = ({
typeMap,
formData,
dispatch,
prevFormData,
prevUiSchema,
prevDataSchema,
prevTypeMap,
}: {
dispatch: Dispatch<Action>
uiSchema: UiSchema
dataSchema: DataSchema
typeMap: Map
formData: Map
prevFormData: Map
prevUiSchema: UiSchema
prevDataSchema: DataSchema
prevTypeMap: Map
}): {
get: Get
set: Set
Expand All @@ -75,69 +83,109 @@ const useSchema = ({
merge: Merge
} => {
const { getTypeKey, getKey } = useGetKey(typeMap)
const get = useCallback<Get>(
(fieldKey) => {
// 找不到则获取根目录
if (!fieldKey) {
return {
uiSchema,
dataSchema,
data: formData,
}
} else {
const fieldKeyMap = fieldKey.split('.')
const arr = getTypeKey(fieldKey).split('.')
return arr.reduce(
(prev, cur, index, arr) => {
if (cur === '') {
// 返回根目录的dataSchema、uiSchema、formData
return prev
} else if (
index === 0 ||
(typeMap[arr.slice(0, index).join('.')] as Map).type === 'object'
) {
// 对象类型
return {
uiSchema: (prev.uiSchema.properties as Map)[cur],
dataSchema: (prev.dataSchema.properties as Map)[cur],
data: prev.data ? prev.data[cur] : undefined,
}
} else if (
(typeMap[arr.slice(0, index).join('.')] as Map).type === 'array'
) {
// 数组类型
if (cur === '$container') {
// 普通数组
const get = useCallback<
(
fieldKey?: string,
option?: { isPrev: boolean }
) => {
data: Map | undefined
dataSchema: DataSchema | undefined
uiSchema: UiSchema | undefined
}
>(
(fieldKey, option = { isPrev: false }) => {
const isPrev = option?.isPrev
const newFormData = isPrev ? prevFormData : formData
const newTypeMap = isPrev ? prevTypeMap : typeMap
const newUiSchema = isPrev ? prevUiSchema : uiSchema
const newDataSchema = isPrev ? prevDataSchema : dataSchema
try {
// 找不到则获取根目录
if (!fieldKey) {
return {
uiSchema: newUiSchema,
dataSchema: newDataSchema,
data: newFormData,
}
} else {
const fieldKeyMap = fieldKey.split('.')
const arr = getTypeKey(fieldKey).split('.')
return arr.reduce(
(prev, cur, index, arr) => {
if (cur === '') {
// 返回根目录的dataSchema、uiSchema、formData
return prev
} else if (
index === 0 ||
(newTypeMap[arr.slice(0, index).join('.')] as Map).type ===
'object'
) {
// 对象类型
return {
uiSchema: prev.uiSchema.properties.$container,
dataSchema:
prev.dataSchema[index === 0 ? 'properties' : 'items'],
data: prev.data ? prev.data[fieldKeyMap[index]] : undefined,
uiSchema: (prev.uiSchema.properties as Map)[cur],
dataSchema: (prev.dataSchema.properties as Map)[cur],
data: prev.data ? prev.data[cur] : undefined,
}
} else if (
(newTypeMap[arr.slice(0, index).join('.')] as Map).type ===
'array'
) {
// 数组类型
if (cur === '$container') {
// 普通数组
return {
uiSchema: prev.uiSchema.properties.$container,
dataSchema:
prev.dataSchema[index === 0 ? 'properties' : 'items'],
data: prev.data ? prev.data[fieldKeyMap[index]] : undefined,
}
} else {
// 元祖
return {
uiSchema: prev.uiSchema.properties[cur],
dataSchema: (
prev.dataSchema[
index === 0 ? 'properties' : 'items'
] as Map
)[cur],
data: prev.data ? prev.data[cur] : undefined,
}
}
} else {
// 元祖
return {
uiSchema: prev.uiSchema.properties[cur],
dataSchema: (
prev.dataSchema[index === 0 ? 'properties' : 'items'] as Map
)[cur],
data: prev.data ? prev.data[cur] : undefined,
uiSchema: prev.uiSchema,
dataSchema: prev.dataSchema,
data: prev.data,
}
}
} else {
return {
uiSchema: prev.uiSchema,
dataSchema: prev.dataSchema,
data: prev.data,
}
},
{
data: newFormData,
uiSchema: newUiSchema,
dataSchema: newDataSchema,
}
},
{ data: formData, uiSchema, dataSchema }
)
)
}
} catch (error) {
return {
data: undefined,
uiSchema: undefined,
dataSchema: undefined,
}
}
},
[dataSchema, formData, getTypeKey, typeMap, uiSchema]
)
[
dataSchema,
formData,
getTypeKey,
prevDataSchema,
prevFormData,
prevTypeMap,
prevUiSchema,
typeMap,
uiSchema,
]
) as Get

/**
* 获取当前value值
Expand Down
15 changes: 11 additions & 4 deletions packages/utils/src/type.ts
View file
Original file line number Diff line number Diff line change
@@ -1,9 +1,16 @@
import { Map, ClosestEdge } from './common/type'
import { UnitedSchema, UiSchema, DataSchema } from './schemaHandle/types'
export type Get = (fieldKey?: string) => {
data: Map | undefined
dataSchema: DataSchema
uiSchema: UiSchema
export type Get = {
(fieldKey?: string): {
data: Map | undefined
dataSchema: DataSchema
uiSchema: UiSchema
}
(fieldKey: string, option: { isPrev: boolean }): {
data: Map | undefined
dataSchema: DataSchema | undefined
uiSchema: UiSchema | undefined
}
}

export type GetKey = (
Expand Down
20 changes: 20 additions & 0 deletions website/docs/form/API/utils/get.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,14 @@ type Get = (fieldKey?: string) => {
dataSchema: DataSchema
uiSchema: UiSchema
}
type Get = (fieldKey: string,option:{
// 是否获取上一次的值
isPrev:boolean
}) => {
data: unknown
dataSchema: DataSchema|undefined
uiSchema: UiSchema|undefined
}
```
获取表单的数据、ui、校验信息。
Expand All @@ -22,6 +30,12 @@ type Get = (fieldKey?: string) => {
需要获取表单的key。如果是空字符，则获取所有表单数据
1. option (object)
**可选**，默认为{isPrev:false}
`get`的配置对象，可配置`isPrev`获取上一次值
### 返回
返回一个包含表单数据、ui配置、校验配置的对象。
Expand All @@ -33,10 +47,16 @@ type Get = (fieldKey?: string) => {
```js
//获取全局表单数据
get('').data
//获取上一次的
get('',{isPrev:true}).data
//获取表单a的校验配置
get('a').dataSchema
//获取上一次的
get('',{isPrev:true}).dataSchema
//获取表单 a.b.c 的ui配置
get('a.b.c').uiSchema
//获取上一次的
get('',{isPrev:true}).uiSchema
```
### 获取表单数据
Expand Down

0 comments on commit 13ff612

Please sign in to comment.