我在将参数传递给打字稿中的函数时遇到问题

Question

我是Typescript的新手，在向Typescript中的函数传递参数时遇到问题。当我呈现窗体模态时，会调用此函数。但我最终得到了两个错误：

"类型为'Promise<AxiosResponse>'不可分配给类型为"的参数(数据：记录<字符串，未知>(=>承诺">

"键入"Promise"<AxiosResponse>'未为签名"(数据：记录<字符串，未知>(：承诺"提供匹配项">

function openModal(activity) {
const data = ref({
name: activity.name,
})     
formRender.render(activity, updateActivity(activity.id,{name:data.value.name}))
}

这将是功能：

export function updateActivity(id: number, data: Record<string, unknown>) {
return http.patch(`/${id}`, { name: data.name })
}

FormRender:

export function FormRender<T extends Record<string, unknown>>(formName: string) {
return {
render(formAttributes: T | Record<string, unknown>, service: (data: T) => Promise<unknown>) {
dialog({
component: FormRender,
componentProps: {
formName,
formAttributes,
service
},
})
},

Answer 1

export function updateActivity(id: number, data: Record<string, unknown>) {
return http.patch(`/${id}`, { name: data.name })
}

此函数返回Promise<AxiosResponse<any, any>>。它是一个async函数，这意味着您必须await结果才能获得HTTP请求返回的值。

要获得这种类型的数据，您必须首先等待它，然后获取axios响应的data属性：

export async function updateActivity(id: number, data: Record<string, unknown>) {
const response = await http.patch(`/${id}`, { name: data.name })
return response.data // This may require a JSON.parse or further prep depending on what the API returns
}

现在，由于service参数是作为函数键入的，您应该能够传递一个调用此方法的函数：

formRender.render(activity, (data) => updateActivity(activity.id, {name:data.value.name}))

以下是一个没有类型错误的工作示例