Vue出现Invalid prop告警：modalState预期Boolean类型却得到Function如何解决？

你父组件的addSubjectOpen字段初始化写法错误：Boolean是JavaScript内置的布尔构造函数，本身属于Function类型。子组件首次渲染时，mounted钩子尚未执行，此时传给子组件modalState属性的值就是Boolean这个函数，因此触发类型校验告警。mounted执行后会立刻将addSubjectOpen赋值为布尔值，后续运行时属性类型符合要求，所以你会发现功能正常，仅控制台保留首次渲染的告警。

直接修改父组件的data初始化逻辑，删掉冗余的mounted赋值即可：

// 原错误写法
data(){
    return{
        addSubjectOpen:Boolean
    }
},
mounted(){
    this.addSubjectOpen = false
},

// 修改后写法
data(){
    return{
        // 直接赋值布尔初始值，不需要用构造函数声明类型
        addSubjectOpen: false
    }
},
// 删掉mounted中对addSubjectOpen的赋值语句

修改后addSubjectOpen从初始化开始就是布尔类型，类型校验不会再触发告警。

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