vue3报错:runtime-core.esm-bundler.js:38 [Vue warn]: Invalid prop: type check failed for prop “modelVal

简介: vue3报错:runtime-core.esm-bundler.js:38 [Vue warn]: Invalid prop: type check failed for prop “modelVal

vue3报错:runtime-core.esm-bundler.js:38 [Vue warn]: Invalid prop: type check failed for prop “modelValue”. Expected Boolean, got Object

at


警告的大意是绑定的函数期待得到的是布尔值,但得到的是一个对象


警告原因就是v-model绑定的函数获得的值是一个对象,这个问题一般出现在bus传值或者其他传值方式


逻辑分析:

①el-dialog(不一定是dialog组件)绑定了一个函数

②在script中对函数名进行了定义

③通过bus对这个函数名进行传值

问题出在:

④需要把函数名的.value值设为true

如果没有设置ture,而是把子组件传过来的值(obj类型)赋值给函数名的.vlaue,则会报错

伪代码示意如下:

<tempalte>
//绑定函数
 <el-dialog :function='function' />
</template>
<script setup>
//接受子组件的传值
//问题出在是function.value = e 则报错
bus.on('function', (e) => {
    function.value = true
    )}
//对函数进行定义
const function = ref()
</script> 

搜过其他同类的问题,但这个 Expected Boolean, got Object 问题应该还是算比较新的问题

其他同类的是 期待获得object类型,但得到的是string,诸如此类这里不在叙述,一般都是定义的函数没有写对类型或者赋值没写好类型导致

相关文章
|
1月前
|
JavaScript 前端开发 开发者
VUE 开发——Node.js学习(一)
VUE 开发——Node.js学习(一)
70 3
|
25天前
|
JavaScript 前端开发 持续交付
构建现代Web应用:Vue.js与Node.js的完美结合
【10月更文挑战第22天】随着互联网技术的快速发展,Web应用已经成为了人们日常生活和工作的重要组成部分。前端技术和后端技术的不断创新,为Web应用的构建提供了更多可能。在本篇文章中,我们将探讨Vue.js和Node.js这两大热门技术如何完美结合,构建现代Web应用。
22 4
|
1月前
|
JavaScript 前端开发 开发工具
【Azure Developer】使用JavaScript通过SDK进行monitor-query的client认证报错问题
AADSTS90002: Tenant 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx' not found. Check to make sure you have the correct tenant ID and are signing into the correct cloud. Check with your subscription administrator, this may happen if there are no active subscriptions for the tenant.
|
2月前
|
JavaScript 前端开发 API
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
|
1月前
|
JavaScript 前端开发 应用服务中间件
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
146 0
|
1月前
|
JavaScript
深入解析:JS与Vue中事件委托(事件代理)的高效实现方法
深入解析:JS与Vue中事件委托(事件代理)的高效实现方法
41 0
|
1月前
|
JavaScript 前端开发
前端js,vue系统使用iframe嵌入第三方系统的父子系统的通信
前端js,vue系统使用iframe嵌入第三方系统的父子系统的通信
|
1月前
|
JavaScript 前端开发
原生js常见报错及其处理方案
原生js常见报错及其处理方案
20 0
|
2月前
|
前端开发 JavaScript 开发者
Express.js与前端框架的集成:React、Vue和Angular的示例与技巧
本文介绍了如何将简洁灵活的Node.js后端框架Express.js与三大流行前端框架——React、Vue及Angular进行集成,以提升开发效率与代码可维护性。文中提供了详细的示例代码和实用技巧,展示了如何利用Express.js处理路由和静态文件服务,同时在React、Vue和Angular中构建用户界面,帮助开发者快速掌握前后端分离的开发方法,实现高效、灵活的Web应用构建。
55 3
|
2月前
|
JavaScript 前端开发 UED
让 HTML 向 Vue.js 华丽转身:如何把 `wangEditor` 仿腾讯文档项目整合进 Vue.js
让 HTML 向 Vue.js 华丽转身:如何把 `wangEditor` 仿腾讯文档项目整合进 Vue.js
下一篇
无影云桌面