Vue中使用v-bind绑定对象时布尔值被转换为字符串的问题

问题现象

在Vue项目中,我使用v-bind绑定一个配置对象到组件属性时,遇到了类型转换问题:

报错信息:

[Vue warn]: Invalid prop: type check failed for prop “disabled”. Expected Boolean, got String with value “false”.

我的配置数据:

{
  label: '结算费用',
  prop: 'stationExpenses',
  type: 'input',
  attrs: {
    disabled: true,  // 这里是布尔值
  },
}

模板使用:

<a-input
  v-model="businessFormData.basicInfo[item.prop]"
  v-bind="item.attrs"
/>

问题分析

使用 v-bind=”item.attrs” 时,原本的布尔值 true 被转换成了字符串 “true”,导致组件的 prop 类型检查失败。

疑问

为什么Vue的v-bind会将布尔值转换为字符串?
React中可以直接使用 {…props} 而不会有类型转换问题,Vue为什么不能?
有没有更优雅的解决方案,而不是逐个手动绑定每个属性?

环境信息

Vue版本:2.x
UI框架:Ant Design Vue
求大佬指点!🙏

图示

Vue.js

讨论数量: 0
(= ̄ω ̄=)··· 暂无内容!

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!