Vue3组合式函数传参优化：无需空值实现多场景调用

问题根源在于你给pluckUsers定义的对象解构参数未设置默认值，当不传入任何参数时，函数接收的参数是undefined，尝试从undefined解构属性自然会抛出类型错误。

修改方案 #

直接给函数的参数对象设置默认空对象，同时保留属性的默认值，这样无论是否传参、传部分还是全部参数，都能正常解构：

import { api } from 'boot/axios'

export default function usePlucks() {
  // 给参数对象设置默认值 {}
  const pluckUsers = ({ val = null, excludeIds = null } = {}) => 
    api.get('/users/pluck', { params: { search: val, exclude_ids: excludeIds }})

  return {
    pluckUsers
  }
}

验证各种调用场景 #

修改后以下调用方式都能正常工作：

• 不传任何参数：pluckUsers()
• 仅传val：pluckUsers({ val: 'admin' })
• 仅传excludeIds：pluckUsers({ excludeIds: [props.id] })
• 传全部参数：pluckUsers({ val: 'user', excludeIds: [1,3] })

这样既不需要传空对象pluckUsers({})，也不用刻意给未用到的属性设null，完全符合你的需求。

内容的提问来源于stack exchange，提问作者Luciano