vue3：调用接口的时候怎么只传递一个数组进去，得到一个key-value数据

问：

/**
* 发送取消屏蔽请求
* @param userFileIds 用户文件ID数组
* @returns Promise
*/
const sendCancelShieldRequest = async (userFileIds: string[]) => {
console.log(userFileIds, 'sendCalcel', { userFileIds }

const { data, success, message, code } = await postCancelShield({ userFileIds })
return { success, message, code }
}

这是我的调用接口的代码，现在userFIleds传进来是一个数组，console中也是数组，但是{userFileIds}打印出来却是：
{

        userFileIds:['xx']

}
这样的数据格式，为什么？

回答：

对象字面量打印差异的原因与解决方案

你的代码中出现的现象是正常的JavaScript/TypeScript行为。让我解释一下原因并提供解决方案。

问题分析

console.log(userFileIds, 'sendCalcel', { userFileIds })

这行代码中：

• userFileIds 直接打印数组值

• { userFileIds } 是对象字面量简写，相当于 { userFileIds: userFileIds }

所以控制台会显示：

• 首先是数组本身：['xx']

• 然后是字符串：'sendCalcel'

• 最后是对象：{ userFileIds: ['xx'] }

解决方案

如果你希望统一输出格式，这里有两种修改方案：

方案1：统一使用直接值打印

const sendCancelShieldRequest = async (userFileIds: string[]) => {console.log(userFileIds, 'sendCalcel', userFileIds)// ... 其余代码
}

方案2：使用更清晰的日志输出

const sendCancelShieldRequest = async (userFileIds: string[]) => {console.log('取消屏蔽请求参数:', { userFileIds })// ... 其余代码
}

完整代码（推荐方案）

/*** 发送取消屏蔽请求* @param userFileIds 用户文件ID数组* @returns Promise*/
const sendCancelShieldRequest = async (userFileIds: string[]) => {console.log('发送取消屏蔽请求，参数:', { userFileIds })const { data, success, message, code } = await postCancelShield({ userFileIds })return { success, message, code }
}

这样修改后，控制台输出会更加清晰一致，便于调试和理解