如何确保传入Vue组件的prop函数为async类型？

当然可以验证！你可以利用Vue Prop的validator自定义验证函数来实现这个需求，下面是具体的实现方式：

完整的Prop定义示例 #

callbackFunction: {
  type: Function,
  default: null,
  validator: (value) => {
    // 允许传入null（和你的default值保持一致）
    if (value === null) return true;
    // 校验传入的函数是否为async函数
    return Object.prototype.toString.call(value) === '[object AsyncFunction]';
  }
}

其他可选的判断方式 #

除了上面的方法，你还可以用以下两种方式判断async函数：

• 检查函数的构造函数名称：value.constructor.name === 'AsyncFunction'
• 检查Symbol.toStringTag属性：value[Symbol.toStringTag] === 'AsyncFunction'

注意事项 #

• 以上验证方式是针对用async关键字声明的函数，如果传入的是普通函数但手动返回Promise，这种校验会不通过。如果你的实际需求是只要函数能返回Promise就行，那应该在调用函数时检查返回值类型，而不是在Prop验证阶段判断函数本身。
• 经过bind、call等方式修改后的async函数，依然能通过上述校验，因为这些操作不会改变函数的构造函数标识。

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